Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Google Maps API v3: Can I setZoom after fitBounds?

I have a set of points I want to plot on an embedded Google Map (API v3). I'd like the bounds to accommodate all points unless the zoom level is too low (i.e., zoomed out too much). My approach has been like this:

var bounds = new google.maps.LatLngBounds();  // extend bounds with each point  gmap.fitBounds(bounds);  gmap.setZoom( Math.max(6, gmap.getZoom()) ); 

This doesn't work. The last line "gmap.setZoom()" doesn't change the zoom level of the map if called directly after fitBounds.

Is there a way to get the zoom level of a bounds without applying it to the map? Other ideas to solve this?

like image 739
chris Avatar asked Mar 13 '10 07:03

chris


People also ask

Is Google Maps API no longer free?

You won't be charged until your usage exceeds $200 in a month. Note that the Maps Embed API, Maps SDK for Android, and Maps SDK for iOS currently have no usage limits and are at no charge (usage of the API or SDKs is not applied against your $200 monthly credit).

Can you store Google Maps API data?

You will not pre-fetch, cache, index, or store any Content to be used outside the Service, except that you may store limited amounts of Content solely for the purpose of improving the performance of your Maps API Implementation due to network latency (and not for the purpose of preventing Google from accurately ...

How do I change the zoom level on Google Maps?

Users can zoom the map by clicking the zoom controls. They can also zoom and pan by using two-finger movements on the map for touchscreen devices.

Why is Google Maps API not working?

There are a several reasons why your google maps may not be working, the most common issue being no Google Map API key set or set incorrectly. To use the Google Maps JavaScript API, you must register your app project on the Google Cloud Platform Console and get a Google API key which you can add to your app.


2 Answers

Edit: See Matt Diamond's comment below.

Got it! Try this:

map.fitBounds(bounds); var listener = google.maps.event.addListener(map, "idle", function() {    if (map.getZoom() > 16) map.setZoom(16);    google.maps.event.removeListener(listener);  }); 

Modify to your needs.

like image 106
LGT Avatar answered Sep 19 '22 11:09

LGT


I solved a similar problem in one of my apps. I was a little confused by your description of the problem, but I think you have the same goal I had...

In my app I wanted to plot a one or more markers and ensure the map was showing them all. The problem was, if I relied solely on the fitBounds method, then the zoom-level would be maxed out when there was a single point - that was no good.

The solution was to use fitBounds when there was many points, and setCenter+setZoom when there was only one point.

if (pointCount > 1) {   map.fitBounds(mapBounds); } else if (pointCount == 1) {   map.setCenter(mapBounds.getCenter());   map.setZoom(14); } 
like image 42
Jim Garvin Avatar answered Sep 20 '22 11:09

Jim Garvin