I am writing a javascript which will change the zoom of the map corresponding to some events in the map. I am animating in the map, and I want to change the zoom levels at specific instances and then back to where it satrted from.
Can anyone please help me figure this out?
map.panToBounds((new google.maps.LatLngBounds((new google.maps.LatLng(0,0)),(new google.maps.LatLng(1,1)))));
Just use the panToBounds function from the google.maps.Map class.
It will zoom into the rectangle created from those 2 points.
If you do want to do it without the location use the setZoom function of the google.maps.Map class so it will look like this:
map.setZoom(5);
Related
I am developing an app in which I have a Map control! On this map, I am adding custom pushpins via map.Children property. How can I set a LocationRectangle and then zoom on it? Because I want my pushpins not to be out of the screen size. I want the map to zoom on a level in which all of the pins will be on the screen!
You can use the MapControl's TrySetViewBoundsAsync method. This method allows you to specify a bounding box of the area you want to display (which you can calculate by finding the the farthest pushpins in all directions, which will give you the north-west and south-east corner of the area), a potential margin and a map animation to use while the view is being changed.
You can find more details about the method in the documentation.
I'm currently creating a splash page for a project website. I was instructed to design a world map with a menu on its side and add some blinking effect while hovering on the sub menus.
I'm done with transforming/scaling the map, but I'm having a problem when hovering on sub menus, the small red circles doesn't pop up on where it should be.
Without the .transform() method, the small red circles pop up correctly, but it gives me a big but cropped map.
I used .transform() method to scale the world map down.
I put .transform() method here:
r.path(worldmap.shapes[country]).attr({stroke: "#9b59b6", fill: c, "stroke-opacity": 0.25}).transform("s.628,.740 0,0");
Here's the page with transform() method.
Here's the page without the transform() method.
In the code all of the locations of the cities is stored as lon/lat coordinates in the name attribute. This is then parsed through a world.parseLatLon function which then calls getXY() . I would say that in the function getXY the returning coordinates need to be transformed as well. There is some interesting number manipulation that is going on there (multiplying by 2.6938 and then adding 465.4) - I would say that this is adjusting the coordinates for the size of the image. Now that you have changed the size of the image, these will also need to be adjusted
I want to pan and zoom an OpenLayers.Map to a given OpenLayer.Bounds.
What is a quick way to do this action?
I want to see everything that is in the bounds on the map.
Cheers!
Please try OpenLayers.Map.zoomToExtent(OpenLayers.Bounds) which will zoom to the passed in bounds and recenter the map.
i'm looking for some info about Google Map V3. I want change the color of the zoom control , i want it red...
How can i change the color simply ?
Thank you for response !
They're images, so you can't simply "change" the color. What you can do, however, is create a map WITHOUT the zoom controls and then just use the API and your own DOM elements as zoom controls.
This will give you a very rough idea:
var map = new google.maps.Map();
//zoom out
map.setZoom(map.getZoom()-1);
//zoom in
map.setZoom(map.getZoom()+1);
I have, for example, 10 markers on Google Map. But I zoomed and in visible area left only 2 markers.
Can Google Maps API somehow return me a number of markers in visible area (2 for my example)?
You can evaluate map.getBounds().contains(marker.getPosition()) with each marker to see which ones are included in the current viewport.
The above code is not working. There is no method as such getBounds(). Below is the updated code :
VisibleRegion visibleRegion = map.getProjection().getVisibleRegion();
LatLngBounds mapBound = visibleRegion.latLngBounds;
if(mapBound.contains(marker.getPosition()){
// do somethings i.e. such as changing marker icon and others.
}