0

Once again, I have a strange minor issue with Google Map API v3. I'm sure I've over-looked something easy, but after looking for an answer for hours, I'm ready to ask for help.

I have a polygon shape that I finally figured out how to zoom into on a click... except that now instead of it zooming into the polygon on a single click, it takes a double-click. What is baffling me is that the script is for a single click. Here is the portion of the script I'm referring to:

    // Add a listener for the click event
  google.maps.event.addListener(zone1, 'center_changed', function() {     
      window.setTimeout(function() {
          map.panTo(marker.position());
      }, 1000);
  });

  google.maps.event.addListener(zone1, 'click', function() {
      map.setCenter(marker.position(29.737, -95.394),
      map.setZoom(18)
      );
  });

Here is a link to a working page: http://www.conleym.com/map/google_maps_code_9_zoom.html *The only polygon currently set up to zoom is polygon1 - the blue shape at the top of the map.

I've tested it on Firefox(23), IE(9) and Chrome(16) all with same results.

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
mike conley
  • 23
  • 1
  • 4
  • Any chance you can take a look at my question regarding Google Maps here http://stackoverflow.com/questions/13689705/how-to-add-google-maps-autocomplete-search-box – Dom Dec 03 '12 at 19:05
  • What is "zone1"? If it is a polygon it does not have a center_changed event....and where did "marker" come from? Also there is no method marker.position(). – Marcelo Dec 04 '12 at 06:24
  • Zone 1 is the polygon being referred to. I'm just learning javascript and since this code isn't working properly, I'm sure it isn't entirely correct, but it's semi-working, which is why I'm confused and have posted here to see if someone could help. I was referred to the code shown a user on another site: (http://pastebin.com/TLEJhDci) Apologies for the .position, which is .getPosition in the original code - I have been trying anything and everything to figure this out and posted my most recent try. If anyone can give me some guidance I would really appreciate it. – mike conley Dec 04 '12 at 15:02
  • also wanted to mention, adding to my confusion - when I put .getPosition back in instead of just .position (which I know is bad), the single click works, but it zooms on the center of the original map instead of the polygon shape being clicked (zone1 in this case) – mike conley Dec 04 '12 at 15:24

1 Answers1

1

I assume you want the map to zoom to the "bounds" of the polygon (to show the whole polygon). In that case you can do something like this (for each zone); and remove the "center_changed" listeners on the polygons:

zone1._myBounds = new google.maps.LatLngBounds();
for (var i=0; i<triangleCoords.length; i++)
{
   zone1._myBounds.extend(triangleCoords[i]);
}

google.maps.event.addListener(zone1, 'click', function () {
  map.fitBounds(zone1._myBounds);
});

working example

Note that this approach is not very extensible (I would suggest making a function that takes the data for the polygon, does all this, then pushes the references onto an array for later use).

geocodezip
  • 158,664
  • 13
  • 220
  • 245