JSFiddle - React, Tailwind, and code Playground

by itsjustcarlos

HTML

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id='container' style='min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto'></div>

JavaScript

$(document).ready(function () {

    // Build the chart
    Highcharts.chart('container', {
        chart: {
            
            type: 'pie'
        },
        title: {
            text: 'Watch Times'
        },
        tooltip: {
            headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
            pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b> <br>people: {point.y}'
        },
        plotOptions: {
            pie: {

                cursor: 'pointer',
                dataLabels: {
                    enabled: true
                },
                showInLegend: true
            }
        },
        series: [{
            name: 'peeps',
            colorByPoint: true,
            data: [{ name: 'Less than 6hrs',
                   y: 2134
                   ,drilldown: 'Less than 6hrs'
},{ name: 'Less than 24hrs',
                   y: 882
                   ,drilldown: 'Less than 24hrs'
},{ name: 'More than 24hrs',
                   y: 1932
                   ,drilldown: 'More than 24hrs'
}]
        }]  ,
         drilldown: {
            series: [{  
                       name: 'Less than 6hrs',
                       id: 'Less than 6hrs',
                       data: [['0 hours',2134]]
                     }
                 ,{  
                       name: 'Less than 24hrs',
                       id: 'Less than 24hrs',
                       data: [['10 hours',578],
['20 hours',304]]
                     }
                 ,{  
                       name: 'More than 24hrs',
                       id: 'More than 24hrs',
                       data: [['30 hours',214],
['40 hours',107],
['50 hours',85],
['60 hours',105],
['90 hours',373],
['160 hours',7],
['170 hours',8],
['190 hours',5],
['210 hours',4],
['270 hours',3],
['280 hours',8],
['70 hours',149],
['80 hours',698],
['100 hours',37],
['110 hours',14],
['120 hours',7],
['130 hours',13],
['140 hours',11],
['150 hours',1],
['200 hours',1],
['230...