Menu
I think the title is enough, I don't even see how to do this for the V2 and V1 API :/
Thanks :)
536
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.
Just try to create the marker and set the draggable property to true . The code will be something as follows: Marker = new google.
You can add a simple marker to the map at a desired location by instantiating the marker class and specifying the position to be marked using latlng, as shown below.
As the other answers suggested, the fitBounds() method should do the trick.
Consider the following example, which will generate 10 random points on the North East USA, and applies the fitBounds() method:
<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> <title>Google Maps LatLngBounds.extend() Demo</title> <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script> </head> <body> <div id="map" style="width: 400px; height: 300px;"></div> <script type="text/javascript"> var map = new google.maps.Map(document.getElementById('map'), { mapTypeId: google.maps.MapTypeId.TERRAIN }); var markerBounds = new google.maps.LatLngBounds(); var randomPoint, i; for (i = 0; i < 10; i++) { // Generate 10 random points within North East USA randomPoint = new google.maps.LatLng( 39.00 + (Math.random() - 0.5) * 20, -77.00 + (Math.random() - 0.5) * 20); // Draw a marker for each random point new google.maps.Marker({ position: randomPoint, map: map }); // Extend markerBounds with each random point. markerBounds.extend(randomPoint); } // At the end markerBounds will be the smallest bounding box to contain // our 10 random points // Finally we can call the Map.fitBounds() method to set the map to fit // our markerBounds map.fitBounds(markerBounds); </script> </body> </html> Refreshing this example many times, no marker ever goes outside the viewport:
118
Here is the way:
map.fitBounds(bounds); map.setCenter(bounds.getCenter()); bounds is an array of the coordinates (markers). Every time when you place marker do something like:
bounds.extend(currLatLng); If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
