JSFiddle - React, Tailwind, and code Playground

by João Vitor Scheuermann

HTML

<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry"></script>
<div id="map"></div>
<div id="map2"></div>

CSS

html, body { height: 100%; margin: 0; padding: 0; }

#map { height: 50%;}
#map2 { height: 50%;}

JavaScript

(function(map) {
  var map;
  map.AppComponent = {
   initMap: function (map_id) {
     var mapOptions = {
       center: {lat:0,lng:0},
       zoom: 3
     };
     map = new google.maps.Map(document.getElementById(map_id), mapOptions);
   }
  }
})(window.map || (window.map = {}));

function init() {
  map.AppComponent.initMap('map');
  map.AppComponent.initMap('map2');
}

init();