How can I best zoom to group of points in google maps api v2? In api v3 I would use bounds object to store the points and then zoom to these bounds using fitBounds() function, but in v2 I really don't know.
I found some advice here, but the solution of writing custom function seems quite clumsy...
http://groups.google.com/group/Google-Maps-API/browse_thread/thread/996f83e075e51fdf
Try this mini tutorial, it sounds like what you want:
http://econym.org.uk/gmap/basic14.htm
var bounds = new GLatLngBounds();
for (... each point ...) {
bounds.extend(latlng);
}
map.setZoom(map.getBoundsZoomLevel(bounds));
map.setCenter(bounds.getCenter());
http://econym.org.uk/gmap/example_map14.htm
Related
I am using goMap jQuery plugin for integrating Google Maps api v3. I have some external controls overlapped on the map - list of countries and I would like to fit bounds off a map to a clicked country.
goMap has fitBounds function but it only fits to the bounds of markers on the map. I found another question and answer regarding how to fit bounds of a map to a country with Google maps api v2 and v3 here, but I don't know how to combine this with goMap plugin.
I haven't used goMap, but it appears you can access the Google Maps API Map object with $.goMap.map. You can then use the Google API fitBounds (or whatever) function directly. Again, I'm not sure one way or the other if there would be any bad side-effects related to the state of the goMap object.
The LatLngBounds function needs the corner points!
How to find the boundary points with center and zoom level given?
Is there Google API V3 which achieves this?
Or can this be done someway with the static maps?
Are you referring to the boundary points of the visible map? If so, you can use the getBounds method of the map object.
var llb = map.getBounds();
If you are using the geocoder, it returns a suggested viewort (that is a google.maps.LatLngBounds() object).
See this similar question:
Google Maps API zoom after setcenter
If you only have the center coordinates and the zoom, use them to initialize the map, listen for the bounds_changed event, then use the map.getBounds() function.
All of the above are described in the documentation
I'm wondering if it's possible to set markers to be visible in a chosen zoom level for the
Google Map API v3.
I figured it's possible in the v2 of the API using the "Marker Manager" but can't find a way for the latest API.
Example:
Marker-1 -> (max_zoom:10, min_zoom:5) //will on be shown within zoom level 5-10
Marker-2 -> (max_zoom:15, min_zoom:10) //will on be shown within zoom level 10-15
As I'm developing an jQuery-plugin I only want to use the original API without add-ons.
Thanks in advance!
Supposing map is the object instanced to manage the gmap, i'd do something like this:
var zoomLevel = map.getZoom();
if (zoomLevel>=5 && zoomLevel<=10) {
// call the setMarker function for the marker1
} else if (zoomLevel>10 && zoomLevel<=15) {
// call the setMarker function for the marker2
}
Maybe u want to handler the zoom change event, if so look at this: http://code.google.com/apis/maps/documentation/javascript/events.html
You can use Marker Manager with API v3. The examples in http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markermanager/ use the most recent Maps API and they seem to work just fine.
For other options, like Marker Clusterer and Fusion Tables, see http://code.google.com/apis/maps/articles/toomanymarkers.html.
You can also do it by checking the zoom level and adding/removing markers from the map based on that, as suggested by #lucke84 in their answer.
Is there any easy ways to find the bounding box of a polyline using Google Maps API v3? I'm working on a project where I need to update the bounds as data is added and removed from the map. This is pretty easy by just doing bd.extend(point) where bd is the bound object and point is a LatLng object. The problem is when I start removing data I would like it to change the bounds and zoom back in. Are there any built in functions that can do this or will I need to write something for myself?
Expanding on oenpelli's solution, this is the extended getBounds() method that I am using to recreate the functionality from V2 API. This is working perfectly in my project.
google.maps.Polyline.prototype.getBounds = function() {
var bounds = new google.maps.LatLngBounds();
this.getPath().forEach(function(item, index) {
bounds.extend(new google.maps.LatLng(item.lat(), item.lng()));
});
return bounds;
};
Just remember that this needs to be added AFTER the API javascript is loaded, so in your init method.
The v2 API had the GPolyline.getBounds() method to do exactly this. However it appears that there is no equivalent method in the v3 API.
You may want to handle this by overriding the changed property of your Polyline MVCObject in order to be notified when the object changes state. Then you can calculate the bounding box using the LatLngBounds.extend() method that you suggested.
I think Google intentionally omitted such methods from the v3 API in an attempt to keep the API lightweight. A similar omission discussed a couple of days ago on Stack Overflow was the GMap2.clearOverlays() method.
You can also extend the Polyline class to add your own getBounds method. Refer to google maps api v3: add point on polyline beetwen two existing points on click polyline event for how to do this.
In Google Maps API v2 we can set to marker an option bouncy:true. It adds to marker eye-candy ability - after dragging this marker, it is bouncing.
Is it possible to do in API v3 ?
Here's how you do it in V3
google.maps.event.addListener(marker, "dragend", function(){
marker.setAnimation(google.maps.Animation.BOUNCE);
});
I just had a quick look at the API v3 spec for Markers - it doesn't look like the 'bouncy' option is available right now but I wouldn't be surprised to see this get implemented into the v3 API at some point - it's still in Beta and bound to change quite a bit.
Here is a link to the API v3 Reference on the available Marker Options
If you really wanted the behavior in a V3 Map now you could tie an event to the 'dragend' method on the Marker Object. Have the function called alter the anchor point of the MarkerImage object - check out the MarkerImage object in the API too.
Well, I was looking for a way for implementing bouncy markers in V3 of google maps so that if we are showing a cluster of markers, the currently selected marker should be visible clearly.
We used the z-index property of the marker to set the z-index of the current marker at a relatively higher value than the rest.