JSFiddle - React, Tailwind, and code Playground

by tomexx

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<div id="container" style="min-width: 270px; height: 220px; margin: 0 auto"></div>

JavaScript

$(function () {
    var config = {
    	chart: {
            type: 'column',
            backgroundColor: 'rgba(40,40,40,1)'
        },
        title: {
            text: ''
        },
        subtitle: {
            text: ''
        },
        legend: {
            enabled: false
        },
        credits: {
            enabled: false
        },
        tooltip: {
            enabled: false
        },
        xAxis: {
            categories: [
                'Likes',
                'Comments',
                'Shares'
            ],
            tickColor: 'rgba(83,83,83,1)',
            gridLineColor: 'rgba(83,83,83,1)',
            gridLineWidth: 1,
            minorGridLineColor: 'rgba(83,83,83,1)',
			lineColor: 'rgba(83,83,83,1)'

        },
        yAxis: {
            min: 0,
            title: {
                text: ''
            },
            gridLineColor: 'rgba(83,83,83,1)',
            minorGridLineColor: 'rgba(83,83,83,1)',
            lineColor: 'rgba(83,83,83,1)'
        },
        plotOptions: {
            column: {
                grouping: false,
                shadow: false,
                borderWidth: 0,
                animation: false,
                enableMouseTracking: false,
            }
        },
        series: [{
            color: 'rgba(126,200,54,1)',
            data: [44, 73, 20],
            pointPadding: 0.3,
            pointPlacement: 0.16
        }, {
            color: 'rgba(43,205,203,1)',
            data: [150, 88, 20],
            pointPadding: 0.3,
            pointPlacement: 0.04
        }, {
            color: 'rgba(168,68,214,1)',
            data: [63, 33, 10],
            pointPadding: 0.3,
            pointPlacement: -0.04
        }, {
            color: 'rgba(255,191,0,1)',
            data: [86, 245, 222],
            pointPadding: 0.3,
            pointPlacement: -0.12
        }]
    };
    
    $('#container').highcharts(config);
});