JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://www.google.com/jsapi?fake=.js"></script>
<div id="chart_container" style="width: 900px; height: 500px;">
<div id="chart_div" style="width: 900px; height: 500px;"></div>
<div id="chart_cover"></div>
</div>
CSS
#chart_container {
position: relative;
}
#chart_cover {
height: 500px;
position: absolute;
width: 900px;
top: 0;
z-index: 10;
}
JavaScript
google.load("visualization", "1", {packages:["geochart"]});
google.setOnLoadCallback(drawRegionsMap);
function drawRegionsMap() {
var data = google.visualization.arrayToDataTable([
['Country', 'Popularity'],
['Germany', 200],
['United States', 300],
['Brazil', 400],
['Canada', 500],
['France', 600],
['RU', 700]
]);
var options = {
tooltip: {
trigger: ''
}
};
var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
chart.draw(data, options);
}