Highcharts Stock Demo

author(s): Torstein Hønsi

by Black Label

HTML

<div id="container" style="height: 400px; min-width: 600px"></div>

<script src="https://code.highcharts.com/stock/highstock.js"></script>
<script src="https://code.highcharts.com/stock/modules/data.js"></script>
<script src="https://code.highcharts.com/stock/modules/exporting.js"></script>
<script type="text/javascript" src="https://www.highcharts.com/samples/data/usdeur.js"></script>

JavaScript

Highcharts.getJSON('https://demo-live-data.highcharts.com/aapl-c.json', function(data) {
  // Create the chart
  Highcharts.stockChart('container', {


    rangeSelector: {
      selected: 1
    },

    title: {
      text: 'AAPL Stock Price'
    },

    xAxis: {
      crosshair: {
        labelsap: {
          enabled: true,
          shape: 'rect',
          //format:'{value:%d%y}',
          backgroundColor: 'rgb(255,0,0)',
          formatter: function(value) {
            return 'label: ' + value;
          }
        },
      }

    },

    yAxis: {
      opposite: true,
      crosshair: {
        label: {
          enabled: true,
          //format: '{value:.2f}',
          shape: 'rect',
          padding: 2,
          formatter: function(number) {
            console.log('here is the numer', number);
            return 'test ' + number;
          }
        }
      },
      labels: {
        align: 'left',
        format: '{value:.2f}',
        y: 6,
        x: 2
      }
    },

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