JSFiddle - React, Tailwind, and code Playground

by damiantt

HTML

<script src="https://www.gstatic.com/charts/loader.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

JavaScript

google.charts.load('current', {
  packages: ['corechart', 'bar']
});
chartJson = {
  "showValues": 1,
  "rotateNames": 0,
  "scrollBorderColor": "051d53",
  "yAxisMaxValue": 100,
  "caption": "Tryb pracy maszyny",
  "trendLines": "",
  "decimalPrecision": 0,
  "animation": 0,
  "scrollBgColor": "0372ab",
  "yAxisName": "[h]",
  "showError": 0,
  "wrapNames": 1,
  "subCaption": "Skala [h]",
  "categories": {
    "category": [{
      "name": "26/04/16 (T-01)"
    }, {
      "name": "26/04/16 (T-02)"
    }, {
      "name": "26/04/16 (T-03)"
    }, {
      "name": "26/04/16 (T-04)"
    }, {
      "name": "27/04/16 (T-01)"
    }, {
      "name": "27/04/16 (T-02)"
    }, {
      "name": "27/04/16 (T-03)"
    }, {
      "name": "27/04/16 (T-04)"
    }, {
      "name": "28/04/16 (T-01)"
    }, {
      "name": "28/04/16 (T-02)"
    }, {
      "name": "28/04/16 (T-03)"
    }, {
      "name": "28/04/16 (T-04)"
    }]
  },
  "dataset": [{
    "set": [{
      "name": "",
      "tooltip": "Praca automatyczna: 0.0h",
      "value": 0
    }, {
      "name": "",
      "tooltip": "Praca automatyczna: 25.1h",
      "value": 25.1
    }, {
      "name": "",
      "tooltip": "Praca automatyczna: 15.3h",
      "value": 15.3
    }, {
      "name": "",
      "tooltip": "Praca automatyczna: 15.3h",
      "value": 15.3
    }, {
      "name": "",
      "tooltip": "Praca automatyczna: 15.3h",
      "value": 15.3
    }, {
      "name": "",
      "tooltip": "Praca automatyczna: 21.1h",
      "value": 21.1
    }, {
      "name": "",
      "tooltip": "Praca automatyczna: 15.5h",
      "value": 15.5
    }, {
      "name": "",
      "tooltip": "Praca automatyczna: 23.8h",
      "value": 23.8
    }, {
      "name": "",
      "tooltip": "Praca automatyczna: 14.3h",
      "value": 14.3
    }, {
      "name": "",
      "tooltip": "Praca automatyczna: 22.9h",
      "value": 22.9
    }, {
      "name": "",
      "tooltip": "Praca automatyczna: 23.5h",
      "value": 23.5
    }, {
      "name": "",
     ...