JSFiddle - React, Tailwind, and code Playground

by Minas Aslanyan

HTML

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

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

JavaScript

$(function() {

  $.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function(data) {
    // Create the chart
    $('#container').highcharts('StockChart', {


      rangeSelector: {
        selected: 1
      },

      title: {
        text: 'AAPL Stock Price'
      },
      yAxis: [{
        top: '5%',
        height: '40%',
      }, {
        top: '55%',
        height: '20%',
      }],

      series: [{
        name: 'AAPL',
        data: [
          [0, 1],
          [1000, 1],
          [2000, 1]
        ],
        lineWidth: 10,
        yAxis: 0,
        tooltip: {
          valueDecimals: 2
        }
      }, {
        name: 'AAPL',
        data: [
          [0, 1],
          [1000, 10],
          [2000, 1]
        ],
        lineWidth: 10,
        yAxis: 1,
        tooltip: {
          valueDecimals: 2
        }
      }]
    });
  });

});