Leaflet / Leaflet.VectorGrid

Display gridded vector data (sliced GeoJSON or protobuf vector tiles) in Leaflet 1.0.0
606 stars 194 forks source link

queryRenderedFeatures feature request #83

Open kelvinabrokwa opened 7 years ago

kelvinabrokwa commented 7 years ago

A feature that returns all features rendered at a certain lon/lat (within a radius for points).

See queryRenderedFeatures in Mapbox GL.

If this is of interest I can take a shot at implementing it.

perliedman commented 7 years ago

Hi, and thanks for the suggestion!

I think this could be useful, and a proof of concept implementation would be very nice.

Some words of caution though: as I'm sure you already know, performance is important for Leaflet.VectorGrid, so it's of course important to make sure that this implementation does not affect rendering performance or memory consumption considerably.

IvanSanchez commented 7 years ago

We already have something like this - the L.Canvas.Tile logic does search for a (leaflet) layer at a given pixel, and with L.SVG.Tile one can already use document.elementsFromPoint(), as everything are DOM elements and the browser can handle queries.

I'm not sure about the use cases for such a feature, though. We already handle event propagation to the features AFAIK.

ssontag55 commented 5 years ago

@IvanSanchez Can you provide an example? Say you have two features, one on top of the other, how could you identify both features?

IvanSanchez commented 5 years ago

@ssontag55 With a SVG implementation and document.elementsFromPoint(), one can get a reference to the individual SVGElements. Storing a reference to the Leaflet layer in every such SVGElement makes things easy.

For Canvas/WebGL implementations, the typical implementation is to encode a unique ID (the layer's _leaflet_id in this case) as RGBA values in a separate canvas. A query for a pixel would then return the internal _leaflet_id and then do a lookup for the layer instance.

ssontag55 commented 5 years ago

Can't really query a pixel if they are both right on top of each other, right

IvanSanchez commented 5 years ago

For Canvas/WebGL implementations, this means one can only query the feature with the top-most symbol.