JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<input type="text" id="mapaddress" />
<input type="submit" id="change" onclick="changeMap()">


<div id="map" style="width: 413px; height: 300px;"></div>

JavaScript

function changeMap(){
  
    var mapOptions = {
        zoom: 16,
        center: new google.maps.LatLng(54.00, -3.00),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
     
    var geocoder = new google.maps.Geocoder();
     
    //var address = '3410 Taft Blvd  Wichita Falls, TX 76308';
    var address= document.getElementById("mapaddress").value;
    
    if(!address) {
        address = '3410 Taft Blvd  Wichita Falls, TX 76308';
    }
    
    geocoder.geocode( { 'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);
            var marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
            });
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });
     
    var map = new google.maps.Map(document.getElementById("map"), mapOptions);

    return false;
}