JSFiddle - React, Tailwind, and code Playground

by prathik

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container" style="min-width: 500px; height: 400px; margin: 0 auto"></div>

JavaScript

Highcharts.chart('container', {
    type:"svg",
    chart:{type:"column"},
    plotOptions:{
    	series:{
      	showInLegend:false,
        dataLabels:{
        	enabled:false
          }
        }
      },
      legend:{
      	align:"right"
      },
      tooltip:{
        formatter:"function () { return <p>${x}(${y})</p>}"
      },
      title:"Chart",
      colors: ["#8CC350","#5A6EAA","#D755A5","#1EBED7","#F0A01E","#9B8CE6","#3CB5A0","#3287D2","#F0557D","#C3D250","#EB782D","#78B4F5","#5FAF69","#AA5FA5","#FA5A50","#F5C841"],
        xAxis:{
        	title:{
        		text:"titlex"
          },
            categories:[59,4,40]
        },
        yAxis:{
        	title:{
          	text:"GuideUtil"
          }
        },
        series:[
        	{
          color: "#0000007F",
          	"data":[30,41,34]
          }
        ]
});