JSFiddle - React, Tailwind, and code Playground

by Khrys

HTML

<script src="http://www.google.com/jsapi?.js"></script>
<div id="dashboard">
    <div id="chart_div" style="width: 100%;"></div>
    <div id="range_filter_div" style="width: 100%;"></div>
</div>

JavaScript

google.load('visualization', '1', {packages: ['controls']});
google.setOnLoadCallback(drawChart);

function drawChart () {
    var data = new google.visualization.DataTable();
    data.addColumn('date', 'Período');
    data.addColumn('number', 'FECHADOS');
    data.addColumn('number', 'EM ABERTO');
    
    data.addRows([
        [new Date(2014, 0), 19, 7],
        [new Date(2014, 1), 29, 4],
        [new Date(2014, 2), 29, 6],
        [new Date(2014, 3), 12, 3],
        [new Date(2013, 0), 42, 0],
        [new Date(2013, 1), 29, 0],
        [new Date(2013, 2), 39, 0],
        [new Date(2013, 3), 37, 0],
        [new Date(2013, 4), 28, 1],
        [new Date(2013, 5), 23, 1],
        [new Date(2013, 6), 31, 0],
        [new Date(2013, 7), 40, 2],
        [new Date(2013, 8), 40, 1],
        [new Date(2013, 9), 34, 4],
        [new Date(2013, 10), 39, 4],
        [new Date(2013, 11), 23, 3],
        [new Date(2012, 0), 21, 0],
        [new Date(2012, 1), 27, 0],
        [new Date(2012, 2), 19, 0],
        [new Date(2012, 3), 26, 0],
        [new Date(2012, 4), 44, 0],
        [new Date(2012, 5), 40, 0],
        [new Date(2012, 6), 35, 0],
        [new Date(2012, 7), 31, 0],
        [new Date(2012, 8), 30, 0],
        [new Date(2012, 9), 32, 0],
        [new Date(2012, 10), 26, 0],
        [new Date(2012, 11), 23, 0],
        [new Date(2011, 8), 16, 0],
        [new Date(2011, 9), 21, 0],
        [new Date(2011, 10), 19, 0],
        [new Date(2011, 11), 24, 0]
    ]); 
    
    var dateFormat = new google.visualization.DateFormat({pattern: 'MMM/y'});
    dateFormat.format(data, 0);
    
    var rangeFilter = new google.visualization.ControlWrapper({
        controlType: 'ChartRangeFilter',
        containerId: 'range_filter_div',
        options: {
            filterColumnIndex: 0,
            ui: {
                chartOptions: {
                    height: 50,
                    backgroundColor: '#F2F2F2',
                    width: '85%', // must be the same in...