Open liyihongcug opened 4 years ago
Hi ! Your layers are canvases, and you can't click through a canvas. See https://github.com/Leaflet/Leaflet.VectorGrid/issues/88#issuecomment-284350575
If possible, use the SVG renderer for the layer with the least elements, and put it above the canvas layer.
Actually you can. See my workaround here: https://gist.github.com/perliedman/84ce01954a1a43252d1b917ec925b3dd
I have to point out that Leaflet.VectorGrid is OK when Leaflet.VectorGrid handle with one vectorTile address. It can click all the feature's properties of the Leaflet.VectorGrid layer.
But when I add many Leaflet.VectorGrid layer. layers address (for examples ,2 Leaflet.VectorGrid layers). It fails that only one layer's feature can be clicked and others can't be clicked.
all the layers are configured with interactive: true by me. I want to know the reason and how to solve with it .
codes are below :(only one (pbfLayer1,pbfLayer2) can be clicked and the other can't be clicked ) var cs1TileOptions = { rendererFactory: L.canvas.tile,
vectorTileLayerStyles: { 'cs1: {
weight: 1....... } }, interactive: true, getFeatureId: function(f) { return f.properties.OBJECTID; } }; v ar pbfLayer1= L.vectorGrid.protobuf(...cs1TileOptions pbfLayer1.on('click', function (e) { var properties = e.layer.properties; //console.log(e); L.popup().setContent('lvhua'+properties.名称+properties.地址+''+ properties.OBJECTID) .setLatLng(e.latlng) .openOn(map); });
var cs2TileOptions = { rendererFactory: L.canvas.tile,
vectorTileLayerStyles: { 'cs2: {
weight: 1....... } }, interactive: true, getFeatureId: function(f) { return f.properties.OBJECTID; } }; v ar pbfLayer2= L.vectorGrid.protobuf(...cs2TileOptions pbfLayer2.on('click', function (e) { var properties = e.layer.properties; //console.log(e); L.popup().setContent( properties.OBJECTID) .setLatLng(e.latlng) .openOn(map); });