JSFiddle - React, Tailwind, and code Playground

by ck1llc

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container" style="height: 400px"></div>

JavaScript

$(function () {
    $('#container').highcharts({
    		chart: {
            type: 'column'
        },
        xAxis: {
		categories:[
                "12:00", "13:00", "14:00", "15:00", "16:00", "17:00", "18:00", "19:00", "20:00", "21:00", "22:00", "23:00", "00:00", "01:00", "02:00", "03:00", "04:00", "05:00", "06:00", "07:00", "08:00", "09:00", "10:00", "11:00"
            ]
        },
        yAxis: [{
                title: {
                    text: 'Value'
                },
            },
          {
                title: {
                    text: 'Value2'
                },
                opposite: true
            }],
        series:[
		{"name":"GB0021_AVIANCA _ L9302:Total Number of Downlink EGPRS MCS1 RLC Data Blocks(P)","color":"#369cd8","data":[4616.0000000,7105.0000000,5356.0000000,18393.0000000,6476.0000000,3594.0000000,9061.0000000,5337.0000000,8121.0000000,4121.0000000,3742.0000000,899.0000000]},
		{"name":"GB0022_AVIANCA _ L9302:Total Number of Downlink EGPRS MCS1 RLC Data Blocks(P)","color":"#cf7a37","data":[5041.0000000,4913.0000000,3788.0000000,6401.0000000,8723.0000000,7216.0000000,7482.0000000,6645.0000000,4424.0000000,3090.0000000,1642.0000000,937.0000000],yAxis : 1},
    {"name":"GB0025_AVIANCA _ L9303:Total Number of Downlink EGPRS MCS2 RLC Data Blocks(P)","color":"#d07dd0","data":[236.0000000,678.0000000,102.0000000,1905.0000000,336.0000000,61.0000000,303.0000000,1261.0000000,317.0000000,316.0000000,165.0000000,52.0000000],yAxis : 1}],
        plotOptions: {
            series: {
                allowPointSelect: true
            }
        }
    });
});