JSFiddle - React, Tailwind, and code Playground

HTML

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

JavaScript

jQuery(function() {
    // Create the chart    
    window.chart = new Highcharts.StockChart({
        chart: {
            renderTo: 'container',
            type: 'scatter',
            renderTo: 'container',
            options3d: {
                enabled: true,
                alpha: 0,
                beta: 90,
                depth: 500
            }
        },
        
        series: [{
            name: 'Female',
            color: 'rgba(223, 83, 83, .5)',
            data: (function(){
                for(var i=0, arr=[];i<10;i++)
                    arr.push([Date.UTC(2011,0,i), Math.random()*10, Math.random()*100 + 1000])
                return arr;
            })()
        },{
            name: 'Male',
            color: 'rgba(119, 152, 191, .5)',
            data: (function(){
                for(var i=0, arr=[];i<10;i++)
                    arr.push([Date.UTC(2011,0,i), Math.random()*10, Math.random()*100 + 1000])
                return arr;
            })()
        }],
        
        navigator: {
            series: {
                type: 'scatter',
                lineWidth: 0,
                marker: {
                    enabled: true,
                    symbol: 'circle',
                    radius: 1
                }
            }
        }
    });
});