JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="ch_x"></div>

JavaScript

function ChartLoad() {
    //doing something here
} 

var Chart;
$(function () {
    Chart =  $('#ch_x').highcharts({
        chart: {
            events : {
                load : ChartLoad,  
                redraw: ChartLoad
            },
        },
        plotOptions: {
            pie: {
                shadow: false,
                dataLabels :{
                    enabled: false
                },
                size: 102,
                states :{
                    hover: {
                        enabled: false
                    }
                }
            }
        },
        tooltip: {
            enabled: false
        },
        series: [           
            {
                type: 'pie',
                //center: [(this.plotWidth * 0.75) - 50, 71], //for the first pie
                center: ['50%', 71],
                name: 'bbb',
                data: [
                    ['', 40.5],
                    ['', 59.5]
                ],
                innerSize: '60%',
                colors: ['#ff0000',"#f5f5f5"],
            },
            {
                type: 'pie',
                //center: [(this.plotWidth * 0.75) + 50, 71], //for the second pie
                center: ['65%', 128],
                name: 'aaa',
                data: [
                    ['', 43.1],
                    ['', 56.9]
                ],
                innerSize: '60%',
                colors: ["#555","#f5f5f5"],
            },            
            {
                type: 'pie',
                center: [-100, -100],
                
                data: [['bbb', 50], ['aaa', 50]],
                
                colors: ['#ff0000',"#555"],
                showInLegend: true
            }            
        ]        
    }); 
});