通过扩展GridLayer，您可以返回一个自定义div元素，以基于坐标为每个图块加载您自己的视觉效果。对于我想做的事情，我想使每个磁贴都具有响应性，这样当您将鼠标悬停在其上方时，它就会执行某些操作。但是，将此属性添加到div不会执行任何操作，与单击和其他交互功能相同。 Leaflet似乎只是分别渲染它们并返回它们生成的合成图像，从而删除了我的属性。
我不得不从地图上拉事件，找到我单击的图块，更改该图块的数据，然后重新加载图层，以便显示更改。有更快，更清洁的方法吗？
答案 0 :(得分：2)
首先，请注意，将none的CSS Leaflet sets属性.leaflet-tile-container {
pointer-events: none;
}
分配给切片容器：
GridLayer即使将事件处理程序附加到磁贴上，也没有事件到达这些事件处理程序。
但是，您可以使用grid.createTile = function (coords) {
var tile = L.DomUtil.create('div', 'tile-hoverable');
// Ensure that this tile will respond to pointer events,
// by setting its CSS 'pointer-events' property programatically
tile.style.pointerEvents = 'initial';
// Attach some event handlers to this particular tile
L.DomEvent.on(tile, 'mouseover', function(){
tile.style.background = 'red';
});
L.DomEvent.on(tile, 'mouseout', function(){
tile.style.background = 'transparent';
});
return tile;
};
和CSS规则上的CSS类，或通过逐位设置该属性的值来覆盖CSS属性的值（BTW确实会读取{ {3}}。
所以我可以做类似的事情
{{1}}
您会看到一个pointer-events。