A simple but complete Highcharts example

This is how you can test the excellent Highcharts library.

Make sure you have JQuery added first.

<link rel="stylesheet" 
      href="https://cdnjs.cloudflare.com/ajax/libs/highstock/6.0.2/css/highcharts.css" 
      integrity="sha256-ji+33kRPEXS0+FM/AbApEs8n5kT2UBiGyk36zs1F9gE=" 
      crossorigin="anonymous" />

Also include the JS

<script src="https://code.highcharts.com/stock/highstock.js" ></script>
<script src="https://code.highcharts.com/stock/highcharts-more.js"></script>

Then use it like this

<script>

  $.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function (data) {
    // Create the chart
    Highcharts.stockChart('container', {
      rangeSelector: {
      selected: 1
    },
    title: {
    text: 'AAPL Stock Price'
  },

  series: [{
      name: 'AAPL',
      data: data,
      tooltip: {
        valueDecimals: 2
      }
    }]
  });
});

</script>

And this is the result:

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.