本章介绍图面覆盖物的鼠标工具和图形编辑工具。除了可以在地图图面上添加点、线、面等多种覆盖物以外,还可以使用一系列地图工具对覆盖物进行编辑。下面介绍几种常用编辑工具的使用。包括:
鼠标工具 MouseTool矢量图形编辑工具
鼠标工具 MouseTool
AMap.MouseTool 插件主要通过用户在地图图面的鼠标操作,绘制相应的点、线、面覆盖物;或者进行图面的距离测量、面积量测、拉框放大、拉框缩小等。
1. 通过鼠标点击绘制覆盖物。
通过 AMap.MouseTool 工具,在图面添加默认样式的 Marker 点:
map.plugin(["AMap.MouseTool"],function(){ var mouseTool = new AMap.MouseTool(map); //使用鼠标工具,在地图上画标记点 mouseTool.marker(); });
如果想通过鼠标点击,在图面添加自定义样式 Marker 点,只需要在 marker 方法中添加点样式 MarkerOptions,具体配置参考「点覆盖物」。
线,面的添加方式同上。只要将 marker 方法替换成相应的线 mousetool.polyline(); 或者 面mousetool.polygon(); 方法即可。
2. 获取通过 AMap.MouseTool 绘制的点、线、面覆盖物的位置/范围/路径。
使用鼠标工具绘制的点、折线、多边形、圆形、矩形等覆盖物,都可以通过多边形覆盖物自身的方法,获取到位置/范围/路径。此处以多边形为例,阐述获取相应信息的方式:
//通过插件方式引入 AMap.MouseTool 工具 map.plugin(["AMap.MouseTool"],function(){ //在地图中添加MouseTool插件 var mouseTool = new AMap.MouseTool(map); //用鼠标工具画多边形 var drawPolygon = mouseTool.polygon(); //添加事件 AMap.event.addListener( mouseTool,'draw',function(e){ console.log(e.obj.getPath());//获取路径/范围 }); });