JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1.1','packages':['corechart']}]}"></script>
       <div id="chart_div" style="width: 900px; height: 500px;"></div>
        <div id="DerivedChart_div" style="width: 900px; height: 500px;"></div>

JavaScript

google.setOnLoadCallback(drawVisualization);

function drawVisualization() {
  // Some raw data (not necessarily accurate)
  var data = new google.visualization.DataTable();
    data.addColumn('number', 'Day');
    data.addColumn('number', 'Avengers2');
    data.addColumn('number', 'Guardians of the Galaxy');
    data.addColumn('number', 'Captain America : The Winter Soldier');
    data.addColumn('number', 'Average');
    data.addColumn({type:'string', role:'tooltip'});
    
 data.addRows([
        
        [2,  80, 15, 10,32.4,"TooltipText"],
        
     
        [6,    80, 35, 30, 7.7,"TooltipText"],
        [7,    80, 40,  35,9.6,"TooltipText"],
        
        [10,  80, 55, 50,11.6,"TooltipText"],
        [11,   80,  60,  55,4.7,"TooltipText"],
        [12,   80,  65,  60,5.2,"TooltipText"],
      
        [14,   80,  75,  70,3.4,"TooltipText"]
      ]);

  var options = {
    title : 'Monthly Coffee Production by Country',
    vAxis: {title: "Collections"},
    hAxis: {title: "Day of the week"},
    
    series: {
        0:{type: "area", areaOpacity: 1.0, color: '#f00', tooltip : false},
        1:{type: "area", areaOpacity: 1.0, color: '#ff0', tooltip : false},
        2:{type: "area", areaOpacity: 1.0, color: '#0f0', tooltip : false},
        3: {type: "line", color: '#000'}}
  };

  var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
  chart.draw(data, options);
    
    google.visualization.events.addListener(chart,'select',selectHandler);
    
    function selectHandler()
    {
      drawPieChart();
        
    }
    function drawPieChart()
    {
        var data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['Work',     11],
          ['Eat',      2],
          ['Commute',  2],
          ['Watch TV', 2],
          ['Sleep',    7]
        ]);

        var options = {
          title: 'My Daily Activities',
          pieHole: 0.4,
        };

        var chart = new...