JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>



<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>

JavaScript

$(function() {
    var chart;

    $(document).ready(function() {

        chart = new Highcharts.Chart({

            chart: {

                renderTo: 'container',

                type: 'column'
            },
            
            plotOptions: {
                column: {
                    shadow: true,
                    groupPadding: 0
                }
            },

            title: {

                text: 'World\'s largest cities per 2008'

            },

            xAxis: {

                categories: [

                    'Tokyo',

                    'Jakarta',

                    'New York',

                    'Seoul',

                    'Manila',

                    'Mumbai',

                    'Sao Paulo',

                    'Mexico City',

                    'Dehli',

                    'Osaka',

                    'Cairo',

                    'Kolkata',

                    'Los Angeles',

                    'Shanghai',

                    'Moscow',

                    'Beijing',

                    'Buenos Aires',

                    'Guangzhou',

                    'Shenzhen',

                    'Istanbul'

                    ],

                labels: {
                    staggerLines: 4
                }

            },

            yAxis: {

                min: 0,

                title: {

                    text: 'Population (millions)'

                }

            },

            legend: {

                enabled: false

            },

            tooltip: {

                formatter: function() {

                    return '<b>' + this.x + '</b><br/>' +

                    'Population in 2008: ' + Highcharts.numberFormat(this.y, 1) +

                    ' millions';

                }

            },

            series: [{

                name: 'Population',

                data: [34.4, 21.8, 20.1, 20, 19.6, 19.5, 19.1, 18.4, 18,

                                        17.3, 16.8,...