JSFiddle - React, Tailwind, and code Playground

by FusionCharts

HTML

<script src="https://s3.amazonaws.com/fusionimplementation/fusion_excel_export/fusioncharts.js"></script>
<!-- A Multi Axis Line chart
The Excel Export feature has been enabled in this sample. Click the menu button and select the format to Export to Excel.-->
<div id="chart-container">FusionCharts will render here</div>

CSS

html,body,#chart-container {
  width : 100%;
  height : 100%;
  overflow : hidden;
}

JavaScript

FusionCharts.ready(function () {
    var revenueChart = new FusionCharts({
        type: 'multiaxisline',
        renderAt: 'chart-container',
        width: '96%',
        height: '96%',
        dataFormat: 'json',
        dataSource: {
    "chart": {
        "exportenabled":"1",
        "exportMode": "server",
        "palette": "2",
        "caption": "CPU Usage",
        "subcaption": "(Last 10 Hours)",
        "xaxisname": "Time",
        "showvalues": "0",
        "divlinealpha": "100",
        "numvdivlines": "4",
        "vdivlinealpha": "0",
        "showalternatevgridcolor": "1",
        "alternatevgridalpha": "5",
        "canvaspadding": "0",
        "labeldisplay": "ROTATE",
        "showborder": "0"
    },
    "categories": [
        {
            "category": [
                {
                    "label": "10:00"
                },
                {
                    "label": "11:00"
                },
                {
                    "label": "12:00"
                },
                {
                    "label": "13:00"
                },
                {
                    "label": "14:00"
                },
                {
                    "label": "15:00"
                },
                {
                    "label": "16:00"
                },
                {
                    "label": "17:00"
                },
                {
                    "label": "18:00"
                },
                {
                    "label": "19:00"
                }
            ]
        }
    ],
    "axis": [
        {
            "title": "CPU Usage",
            "tickwidth": "10",
            "divlineDashed": "1",
            "numbersuffix": "%",
            "dataset": [
                {
                    "seriesname": "CPU 1",
                    "linethickness": "3",
                    "color": "CC0000",
                    "data": [
                        {
                            "value": "16"
                    ...