JSFiddle - React, Tailwind, and code Playground

by heennkkee

HTML

<script src="https://www.google.com/jsapi?ext.js"></script>
<div id="timer">Table took: <span id="tableTimer"></span>
    <div id="chart1"></div>

JavaScript

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

// Create data
function drawChart() {
    var start = new Date();
    
    var data = new google.visualization.DataTable();
        data.addColumn('string', 'foo');
        data.addColumn('number', 'filterValue');
        data.addColumn('number', 'valueOfWealth');
    
    for (x = 0; x < 20; x++){
        for (y = 0; y < 20; y++){
        var value = Math.round(Math.random()*20);   
        var theString = "";
            if (value > 10)
                theString = "foo";
            else
                theString = "bar";
            
        data.addRow([theString, x, value]);
        }
        
    }
    var chart1 = new google.visualization.ChartWrapper({
        chartType: 'Table',
        containerId: 'chart1',
        dataTable: data
    });
        
    google.visualization.events.addListener(chart1, 'ready', function(){
        chartStop = new Date();
        document.getElementById('tableTimer').innerHTML = chartStop-start + " ms";
    });

    chart1.draw();
}