JSFiddle - React, Tailwind, and code Playground

by sbochan

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: 400px; min-width: 310px"></div>

JavaScript

$(function () {

    // create the chart
    $('#container').highcharts({

        title: {
            text: 'AAPL Historical'
        },

        yAxis: [{
            labels: {
                align: 'right',
                x: -3
            },
            title: {
                text: 'OHLC'
            },
            height: '60%',
            lineWidth: 2
        }, {
            labels: {
                align: 'right',
                x: -3
            },
            title: {
                text: 'Volume'
            },
            top: '65%',
            height: '35%',
            offset: 0,
            lineWidth: 2
        }],

        series: [{
            type: 'line',
            name: 'AAPL',
            data: [1, 2, 3, 4, 5]
        }, {
            type: 'column',
            name: 'Volume',
            data: [1, 2, 3, 4, 5],
            yAxis: 1,
        }]
    });
});