v2和v3 Google Maps API可以在同一页面上共存吗?

Oke*_*oke 7 javascript google-maps google-maps-api-3 google-maps-api-2

嘿那里,我试图在页面上同时拥有v3和v2谷歌地图时遇到问题/错误.

我们的应用程序的核心使用了API的v2并添加了一些新的功能,我们决定使用api的v3,因为不推荐使用v2.所以我在应用程序的另一个"选项卡"中动态加载api的v3版本.

问题是如果你点击v3地图,然后点击v2地图,v2地图会在鼠标光标周围开始,就像你点击开始拖动但从未释放鼠标按钮一样.并且基本上是错误,直到你重新加载页面

下面是一个示例,其中包含有关如何复制http://jsbin.com/googlemapv3v2/1的简单说明

奇怪的是,如果您先点击/播放v2地图,然后点击/播放v3地图,这一切都很有效.

因此,一旦加载v3 api,我就尝试通过在v2地图上触发自定义点击/ mousedown事件来"欺骗"它,请参阅http://jsbin.com/googlemapv3v2/2

但那里没有运气,有人有任何想法吗?

编辑:应该注意,它似乎只发生在chrome,firefox,safari没有尝试过歌剧.

Dan*_*llo 2

我不认为这两个 API 应该在同一页面上共存。我尝试了一个非常基本的示例,它恰好与您的问题相同。在 Chrome 5.0 和 Firefox 3.6.6(均适用于 Mac)中测试:

<!DOCTYPE html>
<html> 
<head> 
  <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
  <title>Google Maps v2 and v3 on same page</title> 
  <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false"
          type="text/javascript"></script>
  <script src="http://maps.google.com/maps/api/js?sensor=false" 
          type="text/javascript"></script>
</head> 
<body> 
  <div id="map_v3" style="width: 500px; height: 400px;"></div>
  <div id="map_v2" style="width: 500px; height: 400px; margin-top: 50px;"></div>

  <script type="text/javascript">

    var map3 = new google.maps.Map(document.getElementById('map_v3'), {
      zoom: 6,
      center: new google.maps.LatLng(-41.00, 174.00),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    var map2 =  new GMap2(document.getElementById('map_v2'));
    map2.addControl(new GLargeMapControl3D());
    map2.setCenter(new GLatLng(-41.00, 174.00), 6);
  </script>

</body>
</html>
Run Code Online (Sandbox Code Playgroud)

  • 我参加了悉尼 Google 开发节,并向一位 Google 员工提出了这个问题。我可以确认它们并非设计为存在于同一页面上。 (4认同)