地图事件
地图的内部状态发生变化或者地图上有鼠标等操作时,会触发各种事件,详见示例。
事件的绑定通过 map 实例的 on()方法实现,事件解绑通过 map 实例的 off()方法实现。
//定义事件回调函数
function clickHandler(e){
console.log(e);
}
//绑定地图事件
map.on("click", clickHandler);
//解除地图事件绑定
map.off("click", clickHandler);
地图加载事件
load 事件:地图对象创建后,开始加载地图资源,地图资源加载完成后触发 load 事件。
map.on("load", function() {
// 地图资源加载完成后触发
// 增加自定义数据源、自定义图层
});
鼠标事件
mouseout 事件:当鼠标移出地图时触发;
map.on("mouseout", function() {
console.log("鼠标从地图上移出了");
});
mousedown 事件:当鼠标按下时触发;
map.on("mousedown", function() {
console.log("鼠标按键按下了");
});
mouseup 事件:当鼠标按键释放时触发;
map.on("mouseup", function() {
console.log("鼠标按键释放了");
});
mousemove 事件:当鼠标在地图内移动时触发;
map.on("mousemove", function() {
console.log("鼠标在地图内移动中");
});
click 事件:鼠标在地图上任一位置单击时触发;
map.on("click", function() {
console.log("鼠标单击地图了");
});
dblclick 事件:鼠标在地图上任一位置双击时触发;
map.on("dblclick", function() {
console.log("鼠标双击地图了");
});
contextmenu 事件:鼠标在地图上任一位置右键点击时触发;
map.on("contextmenu", function() {
console.log("鼠标右键点击地图了");
});
移动事件
movestart 事件:地图要开始移动,但还未移动时触发的事件,地图移动过程中不触发;
map.on("movestart", function() {
console.log("地图要开始移动了");
});
move 事件:地图移动过程中触发;
map.on("move", function() {
console.log("地图在移动中");
});
moveend 事件:地图移动一次结束时触发的事件,地图移动过程中不触发;
map.on("moveend", function() {
console.log("地图移动结束了");
});
缩放事件
zoomstart 事件:当地图缩放开始时触发;
map.on("zoomstart", function() {
console.log("地图要开始zoom缩放了");
});
zoom 事件:地图缩放进行时触发;
map.on("zoom", function() {
console.log("地图在zoom缩放中");
});
zoomend 事件:地图缩放结束时触发;
map.on("zoomend", function() {
console.log("地图zoom缩放结束了");
});
旋转事件
rotatestart 事件:当地图旋转开始时触发;
map.on("rotatestart", function() {
console.log("地图要开始旋转了");
});
rotate 事件:地图旋转进行时触发;
map.on("rotate", function() {
console.log("地图在旋转进行中");
});
rotateend 事件:地图旋转结束时触发;
map.on("rotateend", function() {
console.log("地图旋转结束了");
});
俯仰事件
pitchstart 事件:当地图俯仰开始时触发;
map.on("pitchstart", function() {
console.log("地图要开始俯仰了");
});
pitch 事件:地图俯仰进行时触发;
map.on("pitch", function() {
console.log("地图在俯仰进行中");
});
pitchend 事件:地图俯仰结束时触发;
map.on("pitchend", function() {
console.log("地图俯仰结束了");
});
触摸事件
touchstart 事件:手指放在地图上时触发;
map.on("touchstart", function() {
console.log("手指开始触摸地图了");
});
touchend 事件:手指从地图上移开时触发;
map.on("touchend", function() {
console.log("手指触摸地图结束了");
});
touchcancel 事件:手指从地图上移动中断时触发;
map.on("touchcancel", function() {
console.log("手指触摸地图中断了");
});