JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://www.google.com/jsapi"></script>
<h1>Drop Point Map</h1>
<hr />
<div id="map_div" style="width: 99%; height: 85%"></div>
CSS
html, body, #map_div {
height: 100%;
width: 100%;
margin: 0px;
padding: 0px
}
JavaScript
google.load("visualization", "1", {
packages: ["map"]
});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Lat', 'Long', 'Name'],
[12, 77, 'Random location nearby'], ]);
var map = new google.visualization.Map(document.getElementById('map_div'));
map.draw(data, {
showTip: true,
zoomLevel: 10,
mapType: "normal"
});
}