JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.highcharts.com/stock/highstock.js"></script> 
<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>

JavaScript

$(function (){
var dataObj =  {
    chart: {
        type: 'pie',
        renderTo : 'container'
    },
    title: {
        text: 'Highstock Testing',
        align: 'left',
        verticalAlign: 'middle',
        x: 27,
        y: 0,
        useHTML: true

    },
    rangeSelector: {
        enabled: false
    },
    plotOptions: {
        pie: {
            center: ['28%', '20%'],
            dataLabels:{"enabled":false},
            enableMouseTracking:false,
            startAngle: 180
        }
    },
    subtitle: {
        text:'<div style="color: #707070; font-family: ProximaNovaLtSemibold; font-size: 15px;  white-space: nowrap; margin-top: -10px;margin-left: 12px;">testing</div>',
        align: 'left',
        useHTML:true,
        verticalAlign:'bottom',
        y: 0
    },
    credits: {
        enabled:false,
        href: ''
    },
    navigator:{
        enabled:false
    },
    navigation: {
        buttonOptions: {
            enabled: false
        }
    },
    series: [{
        name: 'Usage',
        data: [{"y":0,"color":"#80c3f0","visible":true},{"y":100,"color":"#d7d7d7","visible":true}],
    size: '100%',
    innerSize: '60%'
    }]
};
var abc = Highcharts.StockChart(dataObj); 
});