JSFiddle - React, Tailwind, and code Playground

by knowi

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>
<script src="https://code.highcharts.com/modules/accessibility.js"></script>

<div id="container"></div>

JavaScript

Highcharts.chart('container', {
    chart: {
        type: 'column'
    },
    plotOptions: {
        series: {
            //centerInCategory: true
        }
    },
    legend: {
        verticalAlign: 'top'
    },
    series: [{
        name: "Forecast",
        color: '#89D4F5',
        data: [43, 74, -26, -35, 88, 34, -45, -35, 43]
    },{
        name: "Test",
        color: '#4891EA',
        data: [-20]
    },{
        name: "Test 2",
        color: '#FFBF00',
        data: [20]
    },{
        name: "Test 3",
        color: '#9961A7',
        data: [-5]
    },{
        name: "Actual",
        color: '#BCD759',
        data: [-20, 21, 43, -15, -22, 74, 60, -12, -53]
    }]
});