I have a 'moveend' listener established on an OpenLayers map. I can pan or zoom the map and the listener fires as expected. I also have the need in this app to programmatically change the zoom and the center location, however, when I do the 'moveend' listener fires. Is it possible to distinguish between user-driven view changes and programmatic view changes in OpenLayers?
I am using JavaScript OpenLayers version 2.12.
I don't think there is a way to distingish. But here's what you can do. When you programmatically zoom or change the center location, you can temporarily unregister the moveend event, and then re-register it afterwards:
map.events.unregister( "moveend", map, function );
.
.
programatically zoom
.
.
map.events.register( "moveend", map, function );
Also, when zooming or moving map programmaticaly, you could set some variable to true.
In listener, check that variable. If it's true, map is moved programmaticaly. After checking, set it back to false.
Related
I have a Leaflet map and I want to completely disable panning whether using the mouse, touchscreen, or keyboard, so that the map appears like a static image. I have added map.dragging.disable(); which works for mouse dragging.
But when the map container is focused using the Tab key, pressing the arrow keys on the keyboard will still pan the map. Is there any solution for this?
I think that there are a couple options on Leaflet maps that should resolve your issue.
First, the dragging option, if false, should prevent the mouse from dragging the map.
Next, the keyboard option, if false, should prevent the user from navigating the map with the keyboard.
Also, you should consider setting doubleClickZoom to false if you want your map to be static.
Finally, examine the map option documentation to ensure that I haven't missed any relevant options.
Hope this helps.
Is it possible to make it so you can only zoom in and out by using the zoom buttons as opposed to been able to pinch the screen? Perhaps only sensing one touch at a time or something similar?
The solution is right there in the Leaflet documentation: simply set the map option touchZoom to false when instantiating the map.
Currently iam using google map to display a particular location on map_canvas. There iam also plotting some markers too.
In my application there is an option to set zoom level of the map by the user. User can pinch zoom on map and return the current map zoom value, when clicking on a button the value will be saved. i attain it by using
this.mapObj.getZoom();
What my requirement is to get the zoom level of the map after the user performs the pinch zoom, so that i can display it in a div, so that the user can know the zoom level after each pinch zoom in/pinch zoom out.
Anyone have any idea how can i get the event just after the pinch zoom?
Hope you guys understand what i mean!
NB: Shoot! Found out!
Google Maps API v3: Is there a callback or event listener after zoom changed?
am gonna try this.
Yes, put this somewhere ( I would put that inside initialize() ):
google.maps.event.addListener(map, 'zoom_changed', function() {
...
}
And you read the zoom with map.getZoom().
Also, check out bounds_changed . That is triggerd by zoom, pan and resize of the map. Might become useful to you
I am looking for a way to detect if tiles of google maps v3 are loading or and event which triggers when tiles start loading.
My UI is build as follows:
There is a map on background layer.
On the foreground there is a form in which user enters location.
After he hits enter, map is panning and zooming to specified location.
All I want to do is hide foreground layer AFTER:
1. Map is zoomed
2. Map is panned
3. All tiles are loaded
The problem is that when typed location is very close to starting location, there is no "tilesloaded" event triggered because map panned only few pixels. So I can't depend on "tilesloaded" event.
I can't also depend on "bounds_changed" or "idle" event because they trigger BEFORE all tiles loads.
Do you have any ideas ?
You may:
listen for the tilesloaded-event and hide the form when it fires
to catch the case where tilesloaded didn't fire store the bounds(when opening the form) in a variable. Observe the bounds_changed -event and check if the difference(in screen-pixels) between the northeast/southwest of the stored bounds and the current bounds is less than 256(that's the size of a tile). When it does you may assume that there are no tiles to load, trigger the tilesloaded-event immediately.
I've noticed that the google maps API (and google maps in general) always anchors maps to the left-hand side of their container, like here (resize the window).
I have a situation where I'd like the map to be anchored to the right hand side. I can't find anything in the API docs referring to this. Is it possible?
The answer to this question suggests re-rendering the map with an event listener on resize but this isn't preferable as I'm looking for the effect of a sidebar panel sliding in and 'over top' the map rather than pushing it to the side and then having the map re-center itself afterwards.
How about adding an Event listener on the 'resize' or 'bounds_changed' event?
google.maps.event.addListener(map, 'resize', function(event) {
map.setCenter(myLocation); //
});
This should center the map smoothly as the containing div is resized.
Notes:
You might have to create the resize event manually.
'map' is a Map type object from the Google API
'MyLocation' is a LatLng object
var myLocation = new google.maps.LatLng(-33.679216211612086,151.3031796875);