如何利用框选工具获取多边形范围？

我在地图上画了个框，如何知道他的面积，各个顶点的经纬度呢？我们需要用到鼠标工具插件，AMap.MouseTool。

首先，插件的使用方法分为同步和异步。我们以同步加载插件的方法为例。

<script src="http://webapi.amap.com/maps?v=1.3&key=您的Key&plugin=AMap.MouseTool"></script>
<script>var mouseTool = new AMap.MouseTool(map); //在地图中添加MouseTool插件//......
</script>

然后使用鼠标工具的绘制矩形的方法rectangle，绘制出矩形

var drawRectangle = mouseTool.rectangle(); //用鼠标工具画矩形

再用自己的方式，打印出多边形的各个顶点，用到多边形的getPath方法。使用console.log或者alert等方法，打印出自己需要的数据即可。

    AMap.event.addListener( mouseTool,'draw',function(e){ //添加事件console.log(e.obj.getPath());//获取路径});

当然别忘了创建地图

var map = new AMap.Map('container');

代码效果如下：

全部源代码

<!doctype html>
<html>
<head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width"><title>拉框获取边界经纬度</title><link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/><script src="http://webapi.amap.com/maps?v=1.3&key=0250860ccb5953fa5d655e8acf40ebb7&plugin=AMap.MouseTool"></script>
</head>
<body>
<div id="container"></div>
<script>var map = new AMap.Map('container');var mouseTool = new AMap.MouseTool(map); //在地图中添加MouseTool插件var drawRectangle = mouseTool.rectangle(); //用鼠标工具画矩形
    AMap.event.addListener( mouseTool,'draw',function(e){ //添加事件
        console.log(e.obj.getPath());//获取路径
    });
</script>
</body>
</html>

在线示例

http://zhaoziang.com/amap/getBounds.htm

转载于:https://www.cnblogs.com/milkmap/p/6365587.html

如何利用框选工具获取多边形范围？相关推荐

如何利用Google关键字工具获取网站关键字
Google Adwords关键字工具通过基于搜索的关键字建议,可以按字词.词组.网站或类别获取关键字提示.是站长朋友们,尤其是做英文Google Adsense的英文站站长在网站关键字选择上必不可少 ...
利用微信开发者工具获取小程序指定页面路径！
利用微信开发者工具获取小程序指定页面路径! 小程序不同于app,小程序的每个页面都有页面路径.在使用微信小程序的过程中,很多场景都要使用到小程序的页面路径.比如微信图文中的小程序,公众号菜单中的小程序 ...
CorelDRAWX4的VBA插件开发(三十五)调用C++实现一键智能群组(第4节)递归调用框选工具
上一节没有讲到的递归函数diguiSelect,这一单独列出来讲一下 INT diguiSelect(long count, DOUBLE LX, DOUBLE BY, DOUBLE RX, DOUB ...
python获取文本框里输入的值_如何从Tkinter文本框小工具获取输入？
要从python 3中的文本框中获取Tkinter输入,我使用的完整学生级程序如下: #Imports all (*) classes, #atributes, and methods of tkin ...
【VTK】VTK框选表面拾取三角面片——通过观察者命令模式
VTK框选拾取三角面片最近需要实现拾取三角面片的交互功能,看了官方示例和网友分享,都是使用vtkInteractorStyleRubberBandPick搭配vtkAreaPicker.但是具体实现 ...
下拉框系统甄选火星推荐_下拉框词工具都选16火星软件,下拉框词工具佳选23火星...
现在是十人九商的时代,产品种类和数量日益增多,竞争也在不断加大,微商切忌过长时间消耗在熟人市场,因为你的朋友圈熟人购买是有限的,等她们用完再回购需要时间,做久了你会发现,当你把原有的朋友圈子都卖完了, ...
基于Flask开发网站--利用复选框进行批量操作
由于近期有同事在工作中向我求助网页可视化怎么做,对于从来没有学过html/vue/javascript等框架开发的我来说,只能说我试试吧.所以针对他的诉求"通过复选框进行批量操作" ...
Winform中给DataGridView添加多选框列并获取选中行的内容
场景使用NPOI导入Excel并赋值给DataTable,然后显示在DataGrdView上,并且添加多选框,然后获取选中行的内容. Winform中使用NPOI实现Excel导入并赋值给DataT ...
复选框全选以及获取所有选中的值
复选框全选以及获取所有选中的值总结一下 jsp中获取数据 <%Map<String,List> map = (Map<String,List>)Function ...

如何利用框选工具获取多边形范围？

如何利用框选工具获取多边形范围？相关推荐

最新文章

热门文章