JSFiddle - React, Tailwind, and code Playground

by nithyanandam venu

HTML

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

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

CSS

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

JavaScript

$(function () {


$('#container').highcharts({
    "chart":{
        "alignThresholds":true,
        "type":"column",
        "alignTicks":true,
        "className":"",
        "events":{

        },
        "ignoreHiddenSeries":true,
        "marginBottom":null,
        "marginLeft":null,
        "marginRight":null,
        "marginTop":null,
        "spacingBottom":null,
        "spacingLeft":null,
        "spacingRight":null,
        "spacingTop":null,
        "pinchType":"x",
        "zoomType":"xy",
        "panning":true,
        "panKey":"shift",
        "plotShadow":false,
        "reflow":true,
        "shadow":false,
        "showaxes":false,
        "resetZoomButton":{
            "position":{
                "align":"right",
                "verticalAlign":"top"
            },
            "theme":{
                "fill":"#FFFFFF",
                "r":3,
                "style":{
                    "color":"#000000"
                },
                "states":{
                    "hover":{
                        "fill":"#C0C0C0",
                        "style":{
                            "color":"#000000"
                        }
                    }
                }
            }
        },
        "backgroundColor":"",
        "borderColor":"",
        "borderRadius":0,
        "borderWidth":1,
        "plotBackgroundColor":"#FFFFFF",
        "plotBackgroundImage":"",
        "plotBorderColor":"",
        "plotBorderWidth":0,
        "animation":true
    },
    "title":{
        "align":"center",
        "floating":false,
        "margin":35,
        "text":"Chart Title",
        "verticalAlign":null,
        "style":{
            "color":"#333333",
            "fontWeight":"normal",
            "textDecoration":"normal",
            "fontSize":"18px",
            "fontFamily":"Lucida Grande,Lucida Sans Unicode, Arial, Helvetica, sans-serif",
            "display":"block"
        }
    },
    "subtitle":{
        "align":"center",
       ...