Algum Exemplos de D3.brush () usado com Leaflet?

Eu tenho um mapa de folheto em que coloquei um SVG "em cima de" usando o painel de sobreposição de folheto. Desejo adicionar um pincel D3 ao painel de sobreposição que atualizará um gráfico separado. Procurei por exemplos de exemplos simultâneos de D3.brush () e de folheto, mas não consigo encontrar nenhum.

O mais próximo que encontrei foi este https://github.com/mbostock/d3/issues/1321 e este https://www.mapbox.com/mapbox.js/example/v1.0.0/timeline-scaled-markers/ (isso está escovando o gráfico, não o mapa).

Fiquei me perguntando se:

Alguém sabia de exemplos, OU
Alguém sabia se isso era possível / razoavelmente simples, OU
Se possível, alguém tinha alguma dica sobre o tipo de problemas que eu poderia encontrar.

leaflet d3

— mdgis
fonte

Você conseguiu isso funcionando? Você achou que o pincel não estava alinhado com o mouse no Firefox?

— Frazer Kirkman

Isto é uma alternativa à escova - github.com/w8r/leaflet-area-select

— Frazer Kirkman

Acabei de fazer um exemplo básico com base neste bloco .

Processo

adicione seu grupo de camadas ao mapa (de GeoJSON)
salve seu grupo de camadas em uma variável, ou seja, var layer_group = L.geoJSON(json, {...}).addTo(your_map);
Em sua brushendedfunção, itere layer_group.eachLayer()e use your_map.removeLayer(layer)e your_map.addLayer(layer)para controlar a visibilidade do recurso.

Aqui está o JSFiddle: https://jsfiddle.net/0dyjkk2h/2/

— thibautg
fonte

Talvez eu não tenha entendido corretamente a pergunta. Deseja escovar no mapa ou em um gráfico separado (como no meu exemplo)?

— thibautg