JSFiddle - React, Tailwind, and code Playground

by Pawan Jadhav

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/data.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

JavaScript

$(function () {
    $('#container').highcharts({

        "chart": {
            "backgroundColor": "rgba(255,255,255,0)",
            "reflow": false,
            "height": 400,
            "width": 400
        },
        "xAxis": {
            "opposite": true,
            "labels": {
                "enabled": true,
                "rotation": 0,
                "staggerLines": 3
            },
            "categories": ["resolved", "new", "feedback", "confirmed", "assigned", "acknowledged"]
        },
        "yAxis": {
            "opposite": false,
            "reversed": true

        },
        "series": [{
            "type": "column",
            "data": [{
                "y": 3839053
            }, {
                "y": 56324
            }, {
                "y": 472582
            }, {
                "y": 59168
            }, {
                "y": 20817244
            }, {
                "y": 532258
            }],
            "name": "Id"
        }]


    });
});