JSFiddle - React, Tailwind, and code Playground

by longmatthewh

HTML

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

<div id="container"></div>

CSS

#container {
  min-width: 300px;
  max-width: 800px;
  height: 300px;
  margin: 1em auto;
}

JavaScript

Highcharts.chart('container', {
    xAxis: {
    	categories: ['Apples', 'Pears', 'Bananas', 'Oranges']
    },
    series: [{
        data: [1, 4, 3, 5],
        type: 'column'
    },{
        data: [2, 1, 5, 4],
        type: 'column'
    },{
        data: [3, 2, 1, 2],
        type: 'column'
    }],
    legend: {
      itemHiddenStyle:{
      	color:"pink"
      }
    }			
});