JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/javascript" src="http://highcharts.com/js/testing.js"></script>

<div id="chart1div" style="height: 300px"></div>

JavaScript

$(window).load(function(){
    
var data = [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
    chart1 = new Highcharts.Chart({
    chart: {
        renderTo: 'chart1div',
        type: 'column',
        height: 265,
        width: 280,
        margin: [0, 0, 0, 0]
    },
//    colors: colorArray,
    credits: {
        enabled: false
    },
    tooltip: {
        backgroundColor: "black",
        borderWidth: 0,
        style: {
            color: 'white',
            fontWeight: 'bold',
            fontSize: 10,
            fontFamily: 'arial'
        },
        formatter: function() {
            var tooltipObj = {};
            tooltipObj.Sector = this.point.name;
            tooltipObj.Percentage = this.point.y;
            return "<span style='font-family: arial; font-size: 10px; font-weight:bold'>" + tooltipObj.Sector + " <br/>US Core Value Equity<br/>" + tooltipObj.Percentage + "</span>";
        }
    },
    plotOptions: {
        pie: {
            shadow: false,
            borderColor: "white",
            borderWidth: 2,
            showInLegend: false,
            dataLabels: {
                enabled: false
            }
        },
        series: {
            events: {
//                click: showInfo
            }
        }
    },
    title: {
        text: null
    },
    series: [{
        color: '#C8D528',
        type: 'pie',
        data: data
    }]
});
//}, fillLegend)


});