Javascript 谷歌地图API未将地图加载到页面

我是一个初学者，在玩Javascript和GMAPSAPIV3。起初，地图加载到我的页面，但当我在同一页面上创建表单，以便用户提供坐标，然后单击submit按钮时，地图应该加载。现在我注意到两件事： 1） 它不断地给出错误： TypeError:s为空 2） API加载正确，但地图未显示

我的JavaScript：

var marker;
var mapProp;
var map;
var myCenter;

function initialize() {

    mapProp = {
        center: myCenter,
        zoom: 5,
        mapTypeId: google.maps.MapTypeId.TERRAIN
    };

    map = new google.maps.Map(document.getElementById("googleMap"), mapProp);

    marker = new google.maps.Marker({
        position: myCenter,
    });

    marker.setMap(map);
}

function pan() {
    myCenter = new google.maps.LatLng(document.getElementById("latitude").value, document.getElementById("longitude").value);

    map.panTo(myCenter);
}

google.maps.event.addDomListener(window, 'load', initialize);

我的HTML：

<div id="googleMap"></div>
<form method="get">
    <fieldset>
        <legend>Redirect to:</legend>
        <label for="latitude">Latitude:</label>
        <input type="text" id="latitude">
        <br>
        <label for="longitude">Longitude:</label>
        <input type="text" id="longitude">
        <br>
        <button id="submit" onclick="pan()">Submit</button>
    </fieldset>
</form>

创建贴图对象时，需要定义一个中心点

不要使用

和

提交

按钮，而是将事件侦听器绑定到按钮

例如：

var button = document.getElementById("panButton");
button.addEventListener("click", pan);

工作示例：

---

希望这有帮助。

myCenter

在创建地图实例时没有定义。我应该在pan函数中创建地图实例吗？还是先设置默认中心。地图对象需要

center

属性。已尝试使用默认中心，但当我传递新坐标时，它仍会加载到该默认中心。如何传递新坐标？您记录了这些值吗？工作起来像个符咒：）。非常感谢！

var button = document.getElementById("panButton");
button.addEventListener("click", pan);