JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/javascript" src="http://www.highcharts.com/js/testing-stock-exporting.js"></script>

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


<input id="redrawbutton" type="button" value="redraw">

JavaScript

$(function() {
    step = 0;
                  
    $('#redrawbutton').click(function() {
        var newdata = [];
        for (i=0; i<= 100; i++) {
            newdata.push([(i * 24 * 3600 * 1000) + (1107475200000 + (step * 2 * 7 * 24 * 3600 * 1000)), 50 + Math.random() * 100]);
        }
        step++;
        
        window.chart.series[0].setData(newdata, false)
        
        window.chart.redraw();
    });

    $.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function(data) {
        // Create the chart
        window.chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container'
            },

            rangeSelector: {
                enabled: false
            },

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

            xAxis: [{
                ordinal: false,
                type: 'datetime',
//                tickInterval: 8 * 3600 * 1000,
                tickPosition: 'inside',
                gridLineWidth: 1,
                gridLineColor: '#F0F0F0',
                startOnTick: false,
                endOnTick: false,
                minPadding: 0,
                maxPadding: 0,
                showLastLabel: true,
                labels: {
                    formatter: function() {
                        return Highcharts.dateFormat('%H', this.value);
                    }
                }
            }, {
                ordinal: false,
                linkedTo: 0,
//                tickInterval: 24 * 3600 * 1000,
                labels: {
                    formatter: function() {
                        return Highcharts.dateFormat('<span style="font-size: 12px; font-weight: bold">%a</span>, %b %e', this.value);
                    },
                    align: 'left',
                    x: 3
                },
                opposite: true,
                tickLength: 20,
                gridLineWidth: 1
            }],

     ...