JSFiddle - React, Tailwind, and code Playground

by kwilson81

HTML

<script src="http://maps.google.com/maps/api/js?sensor=false&amp;.js"></script>
<div id="map"></div>

CSS

#map{
    width: 450px;
    height: 400px;
}

JavaScript

var mapManager = (function(){

    var map;

    var createGoogleMap = function(containerId) {
        var options = {
            zoom: 15,
            center: new google.maps.LatLng(-34.397, 150.644),
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        map = new google.maps.Map(document.getElementById(containerId), options);
    };

    var move = function(latitude, longitude) {
        var pos = new google.maps.LatLng(latitude, longitude);
        map.setCenter(pos);
    };
    
    return {
        create: createGoogleMap,
        move: move
    };
    
}());

// Code on page
mapManager.create("map");
mapManager.move(43.650236593550304, -79.35956954956055);

try {
    mapManager.map.setCenter(55.610159758935964, -4.4954681396484375);
}
catch (e) {
    alert(e);
}