Skip to content
Advertisement

Tag: leaflet

How to color vue2 leaflet markers dynamically?

I have an google-maps_pin.svg file which represents a google-maps pin. I would like to color the different markers (generated with v-for) based on categories (restaurant, art gallery, etc.) dynamically. Is there a way to achieve that with vue2 leaflet? Here’s my map: The color I want to give to the individual pins is stored in markedLocation.info.category.color variable. Answer Yes you

How are the bounds calculated in the Leaflet CRS.Simple tutorial?

In the example in Leaflet (for non geographic image), they set “bounds”. I am trying to understand how they computed the values The origin is bottom-left and y increases upwards / x towards the right. How did negative numbers turn up here? Also, after experimentation, I see that the actual pixel coordinates change if you specify different coordinates for bounds.

Get Bounds with Leaflet

I have a DC.JSc Charts which are filtering my icons on my Leaflet Map. Basically, when I’m filtering I want my map to zoom on my selected icons. I’ve tried: Also tried : Error: Object doesn’t support property or method ‘getBounds’ Any ideas? Found my own solution: map.fitBounds(clusterLayer.getBounds()); Answer You’re almost there, but have several mistakes: you’re trying to getBounds

How can I grab a selection of markers with Leaflet.draw?

Context: I’ve made a map, and populated it with around 300 random markers. I can ‘select’ the markers by clicking on a link in the popup and activate a selection to display data from. I also have the Leaflet.draw plugin to draw shapes like circles, rectangles and custom shapes, and I would like to use it to ‘select’ a couple

Leaflet custom url custom tiles

I am working on a custom map with leaflet. So far everything worked fine, but unfortunately the program I am using to split my image into tiles dont start the count with 0 but instead with 1, so my tiles start with “1_1.jpg” and so my whole map is shifted by one tile on y- and x-axis. To rename the

Halt Leaflet event propagation

I am working on a project that uses Leaflet. I have a big map that I am rendering in a browser div, and I am rendering a popup div (using z-ordering) above it when a user clicks on an element. The problem is that if you click on the ‘pop up window’ and drag, leaflet drags the underlying map as

Set tooltip on custom leafletjs control

I have made several custom buttons in Leafletjs – now I would like to add a hover-over tooltip to explain what the button does. I’ve tried putting a “title:” and “tooltip:” in the options but still do not see the text when I hover over the control. Answer To answer my own question I was using the wrong approach to

Advertisement