Is it possible to set a default on click event for all Markers(id est other than the ones i draw or manually code, also for example those that the various geocoders put on map).
Related
I'm trying to make a line graph change color on mouse click by using the select.lineStyle.color attribute.
I'm able to trigger a colour change for the points upon mouse click using select.itemStyle.color and I'm expecting the select.lineStyle.color attribute to change the color of the graph but , it doesn't seem to work despite the documentation saying that select should work for all series.
I even programmatically fired the "select" event (not in the sandbox) but no changes were observed in my line graph.
My code sandbox
Extract from the docs
In addition, we've added click to select to all series, an interaction that was previously only available in a few series such as pie charts and maps, allowing developers to set it to single or multiple selection mode, and to listen to the selectchanged event to get all the selected shapes for further processing. As with emphasis and blur, the selection style can also be configured in select.
Please help me. I've been working on this for a week and found no solutions here. Is there something I'm missing?
Got my answer directly via posting an issue on their Github page.
Apparently, select is only applicable for data object, not series objects(or whatever you call it). So this feature is not available.
What I did, like most people, is to listen to the mouseclick event and update the series-line.lineStyle.opacity property in options directly to blur out other lines. Set triggerLineEvent:true so that clicking any part of the line will fire the mouseclick event, instead of just the data points.
In a map application based on Leaflet, I would like to have a large application menu, kind of a settings menu. I managed to put a nice button into the top right corner as a L.Control and it gets fired on a click.
The menu should position either to the left of the menu button or simply in the middle of the screen.
I am wondering whether it is best practice to use
a Popup,
a Layer,
another Control or
just position a at the right place on the page.
Trying the latter, I found that I have to set z-index to a very high value to see it, and it feels a bit odd not to use the Leafleat features.
What would be the "right" solution to use with Leaflet?
If you want a full screen map, you can use https://github.com/Turbo87/leaflet-sidebar
I use it here: http://franceimage.github.io/map
You can create a nice customized icons based toolbar using Leaflet easybutton plugin.
You will have all the leaflet based controls (Click, hover, position etc.) to set that up as per your requirements.
Here are the implementation examples:
http://danielmontague.com/projects/easyButton.js/v1/examples/
and github repo: https://github.com/CliffCloud/Leaflet.EasyButton
I have a custom div (with settings) within a map. I would like click event not to propagate to map when a user clicks on the div. How could one achieve such behavior?
Leaflet version 1.0.
See the documentation for L.DomEvent.stopPropagation().
For anyone else coming here from a search engine, if you are trying to prevent clicks from a circle or other interactive layer from being handled by the underlying object (other circle or the map itself) you could also create the layer passing the option bubblingMouseEvents: false
Documentation: http://leafletjs.com/reference-1.2.0.html#interactive-layer
I will be trying to show a set of options using the layerGroup functionality to filter out the markers. I need to show a popup when an option is selected from a layer which will prompt the user to enter a number based on which i will be showing the markers. Is there a possible way?
In the above sketch, there' s a sample filter at the top right which i intend to show using the layers but the thing is on selecting the 'Location' option i have to show a popup that will prompt the user to enter a location number and on that basis the markers should be placed on the map.
I guess there would be multiple ways of achieving this, depending on what behaviour exactly you want to get.
E.g. you could use a "dummy" layer (with name "Location" probably?), that you can add in the Layers Control (I guess that is the "sample filter at the top"?). Then listen for this dummy layer for being added to the map, and launch your modal ("popup") at this time. Then when the user enters the necessary information, you can programmatically add the corresponding markers to the map.
If you need further help, please add more details on what behaviour you try to get, or start your implementation and post new questions, so that you already have a start of what you are trying to achieve and people can elaborate on it.
I'm using the leaflet.timedimension plugin to animate GPX trails and I would like to show multiple GPX paths at once with the possibility to deselect one or the other.
This works, but as only the first overlay in the leaflet control is enabled by default the user has to explicitly include the other GPX trails which I would like to avoid.
I've now tried to hack a bit around via:
$(".leaflet-control-layers-overlays label input").prop('checked', true)
and this works partially: all options are selected but still only the first GPX trail is shown. When doing
$(".leaflet-control-layers-overlays label input").trigger('click');
then only one trail is clicked depending on where I put it ('on('ready', function () {...}')
What is the proper way in leaflet to trigger an overlay click?
I just forgot to add both layers to the map:
geoJson1.addTo(map);
geoJson2.addTo(map);