JSFiddle - React, Tailwind, and code Playground

by JoeKuan

HTML

<script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script>
    <script type="text/javascript" src="http://code.highcharts.com/highcharts-3d.js"></script>
        <body>
    <div id="container"></div>
        </body>

JavaScript

$(function () {
    $(document).ready(function() {
        document.title = "Highcharts " + Highcharts.version;

        var chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                type: 'column',
                borderWidth: 1,
                height: 450,
                width: 350,
                marginTop: 40,
                marginRight: 40,
                marginLeft: 30,
                options3d: {
                    alpha: 45,
                    beta: 35,
                    depth: 100,
                    enabled: true
                }
            },
            title: {
                text: null
            },
            credits: { 
                enabled: false
            },
            xAxis: {
                labels: {
                    enabled: false
                }
            },
            tooltip: {
                enabled: false
            },
            yAxis: {
                title: {
                    text: null
                },
            },
            plotOptions: {
                column: {
                    pointPadding: 0,
                    groupPadding: 0,
                    //color: '#5A9D9B',
                    //edgeColor: '#4E898A',
                    color: '#C5542D',
                    edgeColor: '#953A20'
                }
            },
            legend: {
                enabled: false
            },
            series: [{
                data: [ 1500 ],
                depth: 5,
                groupZPadding: 95
            }, {
                data: [ 1300 ],
                depth: 10,
                groupZPadding: 90
            }, {
                data: [ 1100 ],
                depth: 15,
                groupZPadding: 85
            }, {
                data: [ 900 ],
                depth: 25,
                groupZPadding: 75
            }, {
                data: [ 800 ],
                depth: 35,
                groupZPadding: 65
   ...