JSFiddle - React, Tailwind, and code Playground

HTML

Lat: <input type="text" id="lat" value="-37.910524"  />
Long: <input type="text" id="long" value="145.136218" />
<input type="button" id="go" value="Go!" />

<div id="map-canvas"></div>

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

CSS

html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map-canvas { height: 400px }

JavaScript

var map;
function initialize() {
		var latInput = document.getElementById('lat');
		var longInput = document.getElementById('long');
    var mapOptions = {
    		
        center: new google.maps.LatLng(latInput,longInput),
        zoom: 8,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
    }



function addMarker(){
    var lat = latInput.value;
    var long = longInput.value;
    
    if(!lat || !long) return;
    
    var coords = new google.maps.LatLng(lat,long);
    var marker = new google.maps.Marker({
        map: map,
        position: coords
    });
}

google.maps.event.addDomListener(document.getElementById('go'), 'click', addMarker);
google.maps.event.addDomListener(window, 'load', initialize);