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>
    <script type="text/javascript" src="http://code.highcharts.com/modules/drilldown.js"></script>
    <body>
    <div id="container"></div>
    </body>

JavaScript

$(function () {
        var chart;
        $(document).ready(function() {
            document.title = "Highcharts " + Highcharts.version;
            var pTxt = null;
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container',
                    type: 'column',
                    borderColor: '#a1a1a1',
                    borderWidth: 2,
                    borderRadius: 3,
                    width: 550,
                    marginTop: 120,
                    // marginRight: 20,
                    marginLeft: 10,
                    spacingBottom: 60,
                    options3d: {
                        enabled: true,
                        alpha: 25,
                        beta: 30,
                        depth: 30,
                        viewDistance: 100
                    },
                    events: {
                        drilldown: function(event) {
                            var point = event.point;
                            var chart = point.series.chart;
                            var renderer = chart.renderer;

                            if (point.name == 'Internet Explorer') {
                                pTxt = renderer.text('9%', 
                                                     (chart.plotWidth / 2) + chart.plotLeft + 130, 
                                                     (chart.plotHeight / 2) + chart.plotTop + 25).
                                    css({
                                        fontSize: '45px',
                                        fontFamily: 'Old Standard TT',
                                        fontStyle: 'italic',
                                        color: 'blue',
                                        '-webkit-transform': 'perspective(600) rotateY(50deg)'
                                    }).add();

                                chart.options.chart.options3d.alpha = 0;
                               ...