JSFiddle - React, Tailwind, and code Playground

by Shinohara

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.11/lodash.min.js"></script>
<script src="https://ts-3156.github.io/chasingchart/chasingchart-latest.js"></script>

<div id="container" style="min-width: 310px; max-width: 800px; height: 400px; margin: 0 auto"></div>
<button id="button" style="display: block; margin: 0 auto">Start</button>

JavaScript

var input = [{
    "values": [500, 400, 300, 200, 100],
    "categories": ["Cat1", "Cat2", "Cat3", "Cat4", "Cat5"],
    "options": {"title": {"text": "Something statistics"}, "subtitle": {"text": "1900"}}
}, {
    "values": [550, 500, 300, 200, 100],
    "categories": ["Cat2", "Cat1", "Cat3", "Cat4", "Cat5"],
    "options": {"title": {"text": "Something statistics"}, "subtitle": {"text": "2000"}}
}];

var chart = Chasingchart.chart('container');
chart.setData(input);

document.getElementById('button').addEventListener("click", function (event) {
  chart.update();
}, false);