Login/Register
Can the v2 and v3 Google Maps API coexist on the same page?
Asked Answered
Solved javascriptgoogle-mapsgoogle-maps-api-3google-maps-api-2
G

1

7

Hey there, I have an issues/bug when trying to have a v3 and v2 google maps on the page at the same time.

The core of our application uses v2 of the API and adding some new functionality we decided to use v3 of the api since v2 is deprecated. So I'm dynamically loading the v3 version of the api in another "tab" on the application.

The problem is if you click on the v3 map and then click on the v2 map the v2 map starts following the mouse cursor around as if you had clicked to start dragging but never released the mouse button. And basically bugs out till you reload the page

Heres an example, with simple instructions on how to replicate http://jsbin.com/googlemapv3v2/1

The weird thing is if you click/play around with the v2 map first then click/play around with the v3 map it all works nicely.

So I've tried "tricking" it by firing custom click/mousedown events on the v2 map once the v3 api is loaded see http://jsbin.com/googlemapv3v2/2

But no luck there, anyone got any ideas?

EDIT: Should note, it only seems to be happening in chrome, firefox, safari havent tried opera.

Gaskell answered 19/7, 2010 at 1:45 Comment(1)
If you line the maps up just right, it looks like you're dragging one map that fits across two divs. – Stettin
A
2

I don't think the two APIs are meant to co-exist on the same page. I tried a very basic example, which happens to have the same problem as yours. Tested in Chrome 5.0 and Firefox 3.6.6 (both for 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>
Ani answered 19/7, 2010 at 2:37 Comment(8)
The weird thing is they do co-exist if you interact with the v2 map first. – Gaskell
I was a the Sydney Google Dev-Fest and asked a Googler this question. I can confirm they are not designed to exist on the same page. – Aurthur
After emailing support about it one of the developers replied, "Using the same namespace and sharing a good bunch of class, methods and constant ames, V2 and V3 APIs are not designed to run together in the same page." And then in a follow up email "Indeed you can run both versions together, it is possible and works fairly well, considering it's not designed to do so." So I guess the answer is it works sort of ;) – Gaskell
@RueTheWhirled: Interesting. Was this response on the public api groups? – Ani
@Daniel Vassallo nah, I did report a bug about in the api groups but the emails were from google enterprise support – Gaskell
Gonna mark this as the answer although; if it was somehow possible to simulate interacting with the v2 map in the same way as if the user had then it might be possible to overcome the particular issue I've described. I think it might have to do with v2 using an array to store events where v3 is using an object but its in the internals of the API so hard to fix. And having said that there's probably still other bugs with having both v2 and v3 on same page – Gaskell
@RueTheWhirled, so what was the final solution you used? Did you somehow overcome the issues of v2 and v3 on the same page? I'm solving the same issue now. Thanks for information! – Demigod
@Demigod At the time we just avoided having v2 and v3 on same page but looking at my test case it seems to be working now. I haven't done any google maps api development in the last year so not sure what the current situation is sorry – Gaskell

© 2022 - 2024 — McMap. All rights reserved.