Question

我发现使用两个ID显示两个地图的问题; map和map1.首先，我使用了document.getElementByID（'map'）。但我想打电话给两个ids，地图＆amp; map1下面的代码不起作用。

感谢。

 <!DOCTYPE HTML>
  <html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Your Website</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script type="text/javascript">

    jQuery(document).ready(function() {

      // Load google map
      var map = new google.maps.Map(document.querySelectorAll("#gmap","#gmap1"),  {
        center: new google.maps.LatLng(0,0),
        zoom: 3,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        panControl: false,
        streetViewControl: false,
        mapTypeControl: false
      });




    });
    </script>
  </head>
  <body>
    <div style="padding-bottom:10px;"><input type="text" name="address" value="O. J. Brochs g 16a, Bergen" style="width:400px;border:1px solid black"><input type="button" name="search" value="Geocode"></div>
    <div id="coords"></div>
    <div id="gmap" style="width:370px; height:300px;"></div>

    <div style="padding-bottom:10px;"><input type="text" name="address" value="O. J. Brochs g 16a, Bergen" style="width:400px;border:1px solid black"><input type="button" name="search" value="Geocode"></div>
    <div id="coords"></div>
    <div id="gmap1" style="width:370px; height:300px;"></div>
    <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
  </body>  
</html>

Answer 1

我认为问题出在你对document.querySelectorAll的调用上，如果你想使用多个选择器，你必须使用一个用逗号分隔选择器的字符串：

document.querySelectorAll("#gmap,#gmap1")

Answer 2

虽然可以进行多个地图初始化，但您无法使用一个对象进行初始化。创建变量map包含许多属性，包括其在页面中的位置，因此它必须属于仅一个地图。您可以将map引用到另一个变量，但不能在一个google.maps.Map()对象中保存两个地图信息。

认为如果允许的话。中心，标记等在两张地图中都是一样的。但是，它们是两个不同的地图，它们的ID是不同的（对象ID）。

假设您更改了第一张地图的中心。如果您致电map.getCenter();其地图＆＃39;中心将被检索？

为了避免冲突，不允许将多个选择传递给一个google.maps.Map()对象构造函数。

简而言之，您需要使用不同的变量创建地图。

如何用一个脚本显示两个地图？

2 个答案: