JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="jMapCanvas">
</canvas>

JavaScript

/*! Load Google Maps API
 * ------------------------------ */
function loadGmapsApi() {
  var script = document.createElement("script");
  script.type = "text/javascript";
  script.src = "http://maps.googleapis.com/maps/api/js?key=aChaveParaApi&sensor=false&callback=initializeMap";
  document.body.appendChild(script);
}


/*! Initialize the MAP
 * ------------------------------ */
function initializeMap(){

  if ($geoMap.is(':empty')) {

    var myLatlng = new google.maps.LatLng(geoMapLat, geoMapLng);

    var mapOptions = {
      zoom: 14,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      panControl: false,
      scaleControl: false,
      streetViewControl: false,
      mapTypeControl: true,
      mapTypeControlOptions: {
        style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
        position: google.maps.ControlPosition.TOP_CENTER
      },
      zoomControl: true,
      zoomControlOptions: {
        style: google.maps.ZoomControlStyle.SMALL,
        position: google.maps.ControlPosition.TOP_CENTER
      }
    }

    var map = new google.maps.Map(document.getElementById("jMapCanvas"), mapOptions);

    var infowindow = new google.maps.InfoWindow({
      content: $('#jMapInfoBoxContents').html()
    });

    var marker = new google.maps.Marker({
      position : myLatlng,
      map      : map,
      title    : geoMapBox
    });

    google.maps.event.addListener(marker, 'click', function() {
      infowindow.open(map,marker);
    });
    infowindow.open(map,marker);    
  }
}

$(document).ready(function(){

  //cache elements
  $geoMap = $('#jMapCanvas');
  loadGmapsApi();
});