JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://www.google.com/jsapi?ext.js"></script>
<div id="chart" style="height:600px;"></div>

JavaScript

google.load("visualization", "1.1", {packages: ["calendar"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
    var data = google.visualization.arrayToDataTable([
        ['Date', 'Sales', {type:'string', role:'tooltip', p:{'html':true}}],
        [new Date(2015,0,1), Math.log(100),generateTooltip("1 January 2015 - 100")],
        [new Date(2015,0,2), Math.log(500000), generateTooltip("2 January 2015 - 500 000")],
        [new Date(2015,0,3), Math.log(6000), generateTooltip("3 January 2015 - 6 000")],
        [new Date(2015,0,4), Math.log(70000), generateTooltip("4 January 2015 - 70 000")],
        [new Date(2015,0,5), Math.log(802), generateTooltip("5 January 2015 - 802")],
        [new Date(2015,0,6), Math.log(1587), generateTooltip("6 January 2015 - 1 587")],
        [new Date(2015,0,7), Math.log(78630), generateTooltip("7 January 2015 - 78 630")],
        [new Date(2015,0,8), Math.log(660), generateTooltip("8 January 2015 - 660")]
    ]);
    
    var chart = new google.visualization.Calendar(document.getElementById('chart'));
	
    
    chart.draw(data);
    
    function generateTooltip(inputString){
     return '<div style="padding:8px; font-size:13pt;">' + inputString + '</div>'   
    }
}