html地图点击事件监听事件,地图点击和鼠标事件

事件系统

html,

body,

#container {

width: 100%;

height: 100%;

}

请用鼠标在地图上操作试试

地图点击相关事件

绑定事件

解绑事件

//初始化地图对象，加载地图

var map = new AMap.Map("container", {

resizeEnable: true

});

function showInfoClick(e){

var text = '您在 [ '+e.lnglat.getLng()+','+e.lnglat.getLat()+' ] 的位置单击了地图！'

document.querySelector("#text").innerText = text;

}

function showInfoDbClick(e){

var text = '您在 [ '+e.lnglat.getLng()+','+e.lnglat.getLat()+' ] 的位置双击了地图！'

document.querySelector("#text").innerText = text;

}

function showInfoMove(){

var text = '您移动了您的鼠标！'

document.querySelector("#text").innerText = text;

}

// 事件绑定

function clickOn(){

log.success("绑定事件!");

map.on('click', showInfoClick);

map.on('dblclick', showInfoDbClick);

map.on('mousemove', showInfoMove);

}

// 解绑事件

function clickOff(){

log.success("解除事件绑定!");

map.off('click', showInfoClick);

map.off('dblclick', showInfoDbClick);

map.off('mousemove', showInfoMove);

}

// 给按钮绑定事件

document.getElementById("clickOn").onclick = clickOn;

document.getElementById("clickOff").onclick = clickOff;