JSFiddle - React, Tailwind, and code Playground

by oakley808

HTML

<script src="https://www.google.com/jsapi"></script>
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div1" style="width: 900px; height: 500px;"></div>

<div id="chart_div" style="width: 900px; height: 500px;"></div>

<div id="chart_divs" style="width: 900px; height: 500px;"></div>

<div id="curve_chart" style="width: 900px; height: 500px"></div>

JavaScript

google.load("visualization", "1", {
  packages: ["corechart", "bar"]
});
google.setOnLoadCallback(function(){
		drawcharts()
    drawcharts1()
    drawChart()
    drawChart3()
})

function drawcharts() {

  var data1 = google.visualization.arrayToDataTable(
    [
      ['Year', 'Derby', 'Bristol', 'Warrington', 'Indianapolis', 'Dahlewitz', 'Montreal'],
      ['2012', 143754.00, 7607.59, 958.51, 6029.12, 13605.12, 586.00],
      ['2013', 186065.32, 1674.50, 1823.93, 9574.24, 23935.14, 743.43],
      ['2014', 251238.53, 0, 0, 10154.41, 19926.63, 363.71],
      ['2015', 323134.57, 0, 0, 10400.66, 12002.84, 555.86],
      ['2016', 467058.18, 0, 0, 10529.27, 5844.90, 0],
      ['2017', 391209.43, 0, 0, 11072.43, 3603.65, 0],
      ['2018', 460257.40, 0, 0, 12031.69, 1833.52, 0],
      ['2019', 744114.34, 0, 0, 13012.83, 1517.89, 0],
      ['2020', 1484193.59, 0, 0, 14274.78, 1292.55, 0]
    ]);

  var options1 = {
    title: 'Total CPU Hours Per Year By Site',
    hAxis: {
      title: 'Year',
      titleTextStyle: {
        color: 'black'
      }
    },
    vAxis: {
      title: '1000s CPU Hours',
      titleTextStyle: {
        color: 'black'
      }
    }
  };

  var chartA = new google.visualization.AreaChart(document.getElementById('chart_div'));
  chartA.draw(data1, options1);

}




function drawcharts1() {

  var data2 = google.visualization.arrayToDataTable(
    [
      ['Year', 'Derby', 'Bristol', 'Warrington', 'RRC', 'RRD', 'Canada'],
      ['2012', 275.82, 1.145, 0, 2.71, 18.44, 0],
      ['2013', 398.29, 0.04, 0, 3.01, 29.38, 0],
      ['2014', 509.84, 0.04, 0, 3.29, 26.05, 0],
      ['2015', 723.08, 0, 0, 3.54, 13.09, 0],
      ['2016', 951.38, 0, 0, 3.90, 7.59, 0],
      ['2017', 609.01, 0, 0, 4.32, 3.92, 0],
      ['2018', 1002.65, 0, 0, 4.69, 1.70, 0],
      ['2019', 1133.86, 0, 0, 4.93, 1.31, 0],
      ['2020', 2127, 770, 770, 5.31, 0.79, 0]
    ]);

  var options2 = {
    title: 'Total CPU Hours Required For FE Code',
    hAxis: {
      title:...