JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="http://code.highcharts.com/stock/modules/exporting.js"></script>
<div id="container" style="height: 500px; min-width: 500px"></div>

JavaScript

$(function () {

    var data = [
        [1383260400, 14.45208, 32.50, 7.40, 1.80, 18.10],
        [1383346800, 14.49792, 28.00, 4.00, 2.10, 17.90],
        [1383433200, 16.25417, 27.80, 3.90, 2.00, 17.40],
        [1383519600, 14.10208, 64.90, 10.20, 20.90, 27.10],
        [1383606000, 14.67083, 62.60, 8.20, 20.60, 28.70]
    ];
    $('#container').highcharts('StockChart', {
        chart: {
            type: 'spline',
            zoomType: 'xy'
        },

        navigator: {
            adaptToUpdatedData: false,
            series: {
                data: data
            }
        },

        scrollbar: {
            liveRedraw: false
        },

        title: {
            text: 'AAPL history by the minute from 1998 to 2011'
        },

        subtitle: {
            text: 'Displaying 1.7 million data points in Highcharts Stock by async server loading'
        },

        rangeSelector: {
            buttons: [{
                type: 'hour',
                count: 1,
                text: '1h'
            }, {
                type: 'day',
                count: 1,
                text: '1d'
            }, {
                type: 'month',
                count: 1,
                text: '1m'
            }, {
                type: 'year',
                count: 1,
                text: '1y'
            }, {
                type: 'all',
                text: 'All'
            }],
            inputEnabled: true, // it supports only days
            selected: 2 // day
        },

        xAxis: {
            events: {
                //afterSetExtremes: afterSetExtremes
            },
            minRange: 3600 * 1000 // one hour
        },

        series: [{
            name: 'val1',
            data: [],
            dataGrouping: {
                enabled: false
            }
        }]
    }, function (chart) {
        chart.showLoading('Loading data from server...');
        //$.getJSON('grafico_nuovo.php?start='+ Math.round(e.min) +
        //		'&end='+...