I am using d3 with Leaflet (v 1.0.2) and need to catch the viewreset event, but it's not fired.
this.map.on("viewreset", () => console.log("VIEW RESET"));
Is anyone else having this problem? I'm able to catch the zoomend event for example.
Also, manipulating positions and etc. on svg-layers is a bit of a pain as well in the new versions of Leaflet...but that is another story.
JSFidlle showing the problem http://leafletjs.com/reference-1.0.2.html
According to: https://github.com/Leaflet/Leaflet/issues/4837
in 1.0, layers will have to rely on both zoom (zoom change) and viewreset (full reset of a layer). This was necessary to implement flyTo and other arbitrary animations.
And in: https://github.com/Leaflet/Leaflet/pull/3278
remove viewreset event and depend solely on zoom event in layers instead
So viewreset event is no longer triggered on zoom.
Related
When I'm drawing a polygon with Google Maps Api DrawingManager, I use the event listener 'polygoncomplete' to do some actions:
google.maps.event.addListener(drawingManager, 'polygoncomplete', function(poly) {
// Some actions here...
}
Sometimes, especially using the Apple Pencil on iPadPro, the event raises even when not expected: usually it is because I place two vertex one next to the other (but not so much as expected to close polygon).
I wonder if there is a way to control the 'double-click' sensitivity to raise the polygoncomplete event, or if there is a workaround to raise the event in a custom way (ex. clicking a button).
From This question I understand (and tried too) that preventDefault and stopPropagation are not working if used in Maps Api events.
I got the same problem. When you make a double click after the first point, it automatically closes the polygon (with 2 points only). In the callback I make a check, if the points in the polygon are less than 3, do nothing. You can try it with the following code:
google.maps.event.addListener(drawingManager, 'polygoncomplete', function(poly) {
if (poly.getPath().length < 3) {
return;
}
// Some actions here...
}
It's a workaround but works for me. In my case I did that check after showing the poly to the map, so before the 'return' I remove the poly from the map, but that works for me.
I'd like to get the LatLng of the touchpoint in a touchmove event (leaflet map). I didn't find a way to solve this. Are there any ways to get the coordinates?
$(document).on('touchmove', '#mapid', function(e) {
//here i want to get the LatLng coordinates
)};
I see two approaches.
One is to use Leaflet's event handling, y doing something like map.on('mousemove', function(ev){ ... });.
That event handler will receive a Leaflet 'MouseEvent', which includes the LngLat of the point of the map where the event took place. See http://leafletjs.com/reference-1.1.0.html#map-event and http://leafletjs.com/reference-1.1.0.html#mouseevent. And yes, Leaflet listens to TouchEvents and PointerEvents when told to listen to MouseEvents.
The other approach is to use the map's containerPointToLatLng() conversion method, or the mouseEventToLatLng() method to turn a pixel coordinate or a mouse event into a LatLng.
As covered in an existing question, I have a piece of code which (nice and simply) keeps a div updated with the current location of the cursor like so.
function updateLocation(e) {
document.getElementById('current_coordinate').innerText = e.latLng.toUrlValue(6);
}
It works brilliantly until the cursor moves over an overlay. The overlay consumes the event so the event listener I have defined on the map never fires.
google.maps.event.addListener(map, 'mousemove', updateLocation);
Questions:
Must I redefine that listener on every overlay I create or is there simpler way?
If I must define listeners on every overlay, roughly how many overlays may I have without performance suffering?
The overlay is interactive and so setting clickable to false is not an option.
See also these discussions that indicate this is a bug - as yet unfixed:
https://groups.google.com/forum/#!topic/google-maps-js-api-v3/z_K7hxKhonI
https://groups.google.com/forum/?hl=en#!topic/google-maps-js-api-v3/mM0mB9FcyAU
I am implementing an app using Google Maps API 3. I would like to know what is the best implementation in dealing with this problem. I want to execute an action once ANY event in Google Map has been fired. Currently, what I am doing is that I call the function every time a specific event is called. I find this redundant and I have to make a listener for all of the events. So, is there a way to generalize this where I can do the following:
google.maps.addListener(everything_on_the_map_canvas, 'ANY_EVENT', function(event) {
foo();
})
function foo(){
//do something here
}
Thank you.
If the user decides to continue with map operations, they will have to move the mouse over the map to do anything. So you could simply trap a mousemove.
google.maps.event.addListener(map, 'mousemove', function(event) {foo();})
If the user can manipulate the map without moving the mouse over the map, then you will need to listen to other events.
bounds_changed will cover most eventualities with zoom and pan, heading and the like
maptype_id_changed
But that's only three instead of all of them. If the bounds don't change when the tilt does (and you can change tilt from outside the map) you may need to listen for tilt_changed as well.
I am using google maps + javascript + php in my application.
I want to know two things:
In google maps,
does moveend event ALWAYS gets fired
AFTER zoomend/dragend (whichever of
two) event occurs.
When I click zoom icon on google map
or scroll the mouse wheel to zoom,
the zoomend event gets fired more
than once. If I zoom in one step
using + icon on map, the zoomend
event gets fired twice or sometimes
more. any possible loophole.
And so want to know how to stop further event propogation in javascript. (remember I need not use clearListeners as it will forever ignore event handler which is undesirable).
Thank you.
I set up listeners for 'moveend', 'zoomend', and 'dragend' to try it out.
GEvent.addListener(map, "moveend", function() { console.log('moveend'); });
GEvent.addListener(map, "zoomend", function() { console.log('zoomend'); });
GEvent.addListener(map, "dragend", function() { console.log('dragend'); });
It appears that 'moveend' always fires after 'zoomend' or 'dragend'.
However, no events ever fired more than once at a time. Maybe you accidentally set up two simultaneous listeners. You shouldn't need to use stopPropagation or cancelBubble.
you could try just reuturning false or null from the event.
If that doesn't work trying using "event.cancelBubble = true" or "event.stopPropagation"