JSFiddle - React, Tailwind, and code Playground

An example of a Google Timeline using the date data type.

HTML

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
   
    <div id="chart_div"></div>

JavaScript

google.charts.load('current', {'packages':['bar']});
    google.charts.setOnLoadCallback(drawChart);

    function drawChart() {

      var data = new google.visualization.DataTable();
      data.addColumn('timeofday', 'Time of Day');
      data.addColumn('number', 'Emails Received');

      data.addRows([
        [[8,30,30],1],
        [[8,30,30],1],
        [[8,30,31],1],
        [[8,30,31],1],
        [[8,30,32],1],
        [[8,30,32], 1],
        [[8,30,33], 1],
        [[8,30,33], 1],
        [[8,30,34], 1],
        [[8,30,34], 1],
      ]);

      var options = google.charts.Bar.convertOptions({
        title: 'Total Emails Received Throughout the Day',
        height: 450
      });

      var chart = new google.charts.Bar(document.getElementById('chart_div'));

      chart.draw(data, options);
    }