JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="dataplot0" style="width: 350px; height: 200px"></div>
<div id="dataplot1" style="width: 350px; height: 200px"></div>

JavaScript

// chart0 - shows spline plot with working tooltip
// chart1 - shows scatter plot with working tooltip, scroll down to see
var chart0 = new Highcharts.Chart({
    title: {
        text: 'Wind Speed'
    },
    chart: {
        renderTo: 'dataplot0',
        borderWidth: 1,
        defaultSeriesType: 'spline',
        zoomType: 'x'
    },
    legend: {
        enabled: false
    },
    plotOptions: {
        series: {
            marker: {
                enabled: false,
                states: {
                    hover: {
                        enabled: true
                    }
                }
            }
        }
    },
    xAxis: {
        type: 'datetime'
    },
    yAxis: {
        min: 0,
        title: {
            text: 'Wind Speed (m/s)'
        }
    },
    tooltip: {
        //crosshairs: true,
        formatter: function () {
            return '<b>' + Highcharts.dateFormat('%e. %b %Y, %H:00', this.x) + '</b> ' + this.series.name + ': ' + this.y + ' m/s';
        }
    },
    series: [{
        name: 'Wind Speed',
        data: [0.52, 0.778, 0.746, 0.594, 0.716, 0.793, 0.648, 0.828, 0.202, 0.066, 0.116, 0.116, 0.17, 0.195, 0.051, 0, 0.368, 2.365, 2.841, 2.693, 2.416, 2.541, 2.429, 2.888],
        pointStart: 1360893600000,
        pointInterval: 3600000
    }]
});
//
//
//
var chart1 = new Highcharts.Chart({
    title: {
        text: 'Wind Direction'
    },
    chart: {
        renderTo: 'dataplot1',
        borderWidth: 1,
        defaultSeriesType: 'scatter',
        zoomType: 'x'
    },
    legend: {
        enabled: false
    },
    plotOptions: {
        series: {
            marker: {
                radius: 3,
                states: {
                    hover: {
                        enabled: true
                    }
                }
            }
        }
    },
    xAxis: {
        type: 'datetime'
    },
    yAxis: {
        tickInterval: 90,
        min: 0,
        max: 360,
        title: {
            text: 'Wind...