在leaflet插件中单击事件 - 如何使click事件仅在地图图块图像内工作？

Question

我有256 * 256的图像。我已经在传单中设置了图像，如下所述。

var cloudmadeUrl = tileserver + '/' + selected_map + '/tiles_{z}_{y}x{x}.png';

cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 4, noWrap: true, continuousWorld: true });

map = new L.Map('map', {
          center : latlng, 
          zoom : 0, 
          layers : [cloudmade], 
          tms: true
       });

我有地图的点击事件。现在，如果我在平铺图像外单击，则单击事件将起作用。

如何使click事件仅在地图图块图像内工作？

Answer 1

您不必担心地图边界（因为它绑定到容器而不是tilelayer），您可能会担心点击事件目标。有关建议，请参阅Match event.target with existing jquery object。

这是一个working JSFiddle。它使用Leaflet代码中的event.originalEvent来收集有关原始点击事件的信息。然后它根据click事件的类做了一些事情。