JSFiddle - React, Tailwind, and code Playground

by damiantt

HTML

<script type="text/javascript" src="//www.google.com/jsapi"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

<input id="Draw" type="button" value="Draw" onclick="drawChart();" />

<div id="chart_div_container" style="overflow-x: auto;min-height:0%;">
  <div id="chart_div" style="overflow: visible;min-height:0%;"></div>
</div>

JavaScript

google.charts.load('current', {
  'packages': ['timeline', 'table']
});

var initWidth = $('#chart_div').innerWidth();
var colorMap;

function drawChart() {
	$('#chart_div').off();
	$('#chart_div').empty();
  var data = google.visualization.arrayToDataTable([
    ['Maszyna', 'Kolor', {
      type: 'string',
      role: 'tooltip',
      'p': {
        'html': true
      }
    }, 'Start Time', 'End Time'],

    ['one', 'pi1', 'brr',
      new Date(2014, 10, 15, 12, 30, 0),
      new Date(2014, 10, 15, 12, 30, 20)
    ],
    ['one', 'pu3', 'brr',
      new Date(2014, 10, 15, 12, 30, 20),
      new Date(2014, 10, 15, 12, 30, 45)
    ],
    ['one', 'pu3', 'brr',
      new Date(2014, 10, 15, 12, 30, 45),
      new Date(2014, 10, 15, 12, 30, 55)
    ],
    ['two', 'g2', 'brr1',
      new Date(2014, 10, 15, 12, 30, 35),
      new Date(2014, 10, 15, 12, 30, 55)
    ],

    ['two', 'pi1', 'brr2',
      new Date(2014, 10, 15, 12, 30, 55),
      new Date(2014, 10, 15, 14, 31, 55)
    ],

    ['three', 'pu3', 'brr',
      new Date(2014, 10, 15, 12, 29, 30),
      new Date(2014, 10, 15, 14, 30, 0)
    ],
    ['three', 'pi1', 'brr',
      new Date(2014, 10, 15, 14, 30, 0),
      new Date(2014, 10, 15, 14, 35, 0)
    ],
    ['three', 'g2', 'Zbrr',
      new Date(2014, 10, 15, 14, 35, 0),
      new Date(2014, 10, 15, 15, 25, 10)
    ],
    ['three', 'pu3', 'KR1',
      new Date(2014, 10, 15, 15, 25, 10),
      new Date(2014, 10, 15, 15, 26, 00)
    ],
    ['three', 'g2', 'KR2',
      new Date(2014, 10, 15, 15, 26, 00),
      new Date(2014, 10, 15, 15, 26, 45)
    ],
    ['three', 'pi1', 'KR3',
      new Date(2014, 10, 15, 15, 26, 45),
      new Date(2014, 10, 15, 15, 27, 15)
    ],
    ['three', 'pu3', 'brr',
      new Date(2014, 10, 15, 15, 27, 15),
      new Date(2014, 10, 15, 20, 30, 1)
    ],
    ['three', 'pi1', 'brr',
      new Date(2014, 10, 15, 20, 30, 1),
      new Date(2014, 10, 16, 10, 30, 10)
    ],
    ['three', 'pu3', 'brr',
      new Date(2014, 10, 16, 10, 30,...