对于更多可能仍然有这个问题的人，我使用了一个自关闭的<div id="map1" />标签，第二个div没有显示，似乎不在dom中。只要我把它改成两个打开和关闭标签<div id="map1"></div>它就工作了。hth

同样，确保你没有在选择器中放置散列符号(#)

    document.getElementById('#map') // bad

    document.getElementById('map') // good

声明。它不是jQuery。给赶时间的人一点提醒。

实际上最简单的方法来解决这个问题，只是移动你的对象之前Javascript代码，它对我有用。我猜在你的答案对象是加载后javascript代码。

<style type="text/css" >
      #map_canvas {
              width:300px;
            height:300px;
     }

 <div id="map_canvas"> </div> // Here 

<script type="text/javascript">

var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
            myOptions);

</script>

<div id="map_canvas"> </div>

还要注意不要写信

google.maps.event.addDomListener(window, "load", init())

正确的:

google.maps.event.addDomListener(window, "load", init)

我知道我有点晚了，只是想补充一下，当页面中不存在div时，错误也会发生。您还可以在加载谷歌maps函数调用之前检查div是否存在。类似的

function initMap() {
    if($("#venuemap").length != 0) {
        var city= {lat: -26.2041, lng: 28.0473};
        var map = new google.maps.Map(document.getElementById('venuemap'), {
       etc etc
     }
}

如果在循环中创建多个映射，如果单个映射DOM元素不存在，则会破坏所有映射。首先，在创建新的Map对象之前，检查以确保DOM元素存在。

[...]

for( var i = 0; i <= self.multiple_maps; i++ ) {

  var map_element = document.getElementById( 'map' + '-' + i.toString() );

  // Element doesn't exist, don't create map!
  if( null === map_element ) {
    continue;
  }

  var map = new google.maps.Map( map_element, myOptions);
}

[...]