|
公司项目需求为用户上传光栅图，然后在图上标注监控点位，因百度地图API不支持不使用地图直接操作一张图片，于是选择Leaflet.js实现业务功能。
看网上代码将光栅图以 imageOverlay 对象添加到地图容器，后发现无法触发点击事件，关键代码如下
var image = L.imageOverlay('images/timg.jpg', bounds).addTo(map);
image.on('click',function(e){
console.log(e);
})
搜索半天没找到结果，只能去翻阅官方API，才发现问题，imageOverlay 对象有个默认属性interactive默认值为false，即默认不响应鼠标事件，将其设成true就正常了。
var image = L.imageOverlay('images/timg.jpg', bounds,{interactive:true}).addTo(map);
image.on('click',function(e){
console.log(e);
})
imageOverlay 对象支持的鼠标事件比marker的少，如下：
| Event | | Description |
|---|
click | | Fired when the user clicks (or taps) the layer. | dblclick | | Fired when the user double-clicks (or double-taps) the layer. | mousedown | | Fired when the user pushes the mouse button on the layer. | mouseup | | Fired when the user releases the mouse button pushed on the layer. | mouseover | | Fired when the mouse enters the layer. | mouseout | | Fired when the mouse leaves the layer. |
| 
转播
