最近做了一个百度地图API的开发项目,里面有测量距离和测量面积的功能需求。测量距离百度给出了封装好的javascript包——BMapLib.DistanceTool,效果如下:

这个效果体验很好;测量面积也给出了开源javascript包——BMapLib.DrawingManger,如下:

但这个效果和体验就很差了。客户希望测量面积能实现和测距一样的效果体验(鼠标在移动绘制过程中实时显示绘制面积,且样式效果要一样),经过一番折腾,修改了百度测距的javascript包,终于搞定。先上效果图:

实现方法:

主要修改了DistanceTool开源包里面的鼠标点击事件distClick和鼠标移动事件distMove这两个方法。

1、通过单击事件distClick获取构造面的path,用到Polygon的setPath方法,然后加到地图中,并通过计算该Polygon的面积显示最终双击结束后提示框的总面积;

2、通过移动事件distMove获取鼠标移动过程的位置点point,利用Polygon类的setPositionAt方法生成动态的面。这一步需要计算鼠标移动过程中的实时面积,构造一个临时面polygon,并不需要加到地图中,在鼠标移动过程中将移动点point加到临时面path中,计算该Polygon的面积即为临时面积。

注:计算Polygon的面积采用百度开源库GeoUtils,BMapLib.GeoUtils.getPolygonArea方法。

如有不对之处,欢迎批评指正!

联系方式:QQ:1085634689

 

百度地图API开发一——仿照现有测距效果实现测面功能的更多相关文章

  1. 深入浅出百度地图API开发系列(1):前言

    百度地图API目前在地图API领域越来越受到众多开发者的关注,许多应用都使用到了百度地图API服务,包括博主me,我自己使用做的是Javascript API,根据经验,我想整理出一份系列教程,如果能 ...

  2. 深入浅出百度地图API开发系列(2):创建地图

    上一篇文章里,先介绍了一下百度地图API开发所涉及到的一些基础概念,包括投影,坐标系等基础概念,再有了这些基础后,我们可以开始开发自己的web地图了.先来个代码示例(建议大家都是用百度地图API大众版 ...

  3. 基于MFC与第三方类CWebPage的百度地图API开发范例

    在进行百度地图API开发之前你需要到http://developer.baidu.com/map申请密匙 密匙申请之后就可以进行百度地图API的开发了. 下面我们以在visual c++6.0里进行地 ...

  4. 百度地图API开发指南

    简介什么是百度地图API? 百度地图API是一套由JavaScript语言编写的应用程序接口,它能够帮助您在网站中构建功能丰富.交互性强的地图应用.百度地图API包含了构建地图基本功能的各种接口,提供 ...

  5. 深入浅出百度地图API开发系列(3):模块化设计

    在前面两张简单介绍了百度地图API的基础知识和使用之后,我们来分析一下百度地图API的基本架构,了解一下基本架构可以帮助我们更清晰的了解API的功能和调用过程,也就可以帮助我们在实际开发中可以更方便的 ...

  6. android 基于百度地图api开发定位以及获取详细地址

    一:百度地图开发必须要到百度开发平台android开发api下载相应的库,已经申请百度地图开发key. 二:新建项目baidumaplocation.设计main.xml文件这里注意的是MapView ...

  7. 百度地图API开发----手机地图做导航功能

    第一种方式:手机网页点击打开直接进百度地图APP <a href="baidumap://map/direction?mode=[transit:公交,driving:驾车]& ...

  8. 百度地图API开发的快速使用和大量坐标点操作【点聚合,海量点,mapv】

    快速上手 注意:本篇文章代码是基于 百度地图 JavaScript API v3.0 的条件下编写,GL版本可能稍有变化. 地图嘛,很重要的一部分就是坐标经纬度了: 经度: 英文 longitude ...

  9. 百度地图API开发

    1.首先申请百度地图秘钥 http://lbsyun.baidu.com/ 2.需要填一个申请的界面 3.申请后会有类似的东西 4.之后参照以下网址进行MFC编译 mfc webbrowser控件使用 ...

随机推荐

  1. 无敌简单快速的文件服务器sgfs

    前言 想要构建一个Linux文件服务器?看看下面几个要求是不是你想要的? 1.只需要单节点部署就够了 2.部署启动简单,下载之后,一键启动,一键关闭 3.不需要任何其他的依赖安装,而且运行时占用内存资 ...

  2. rocketMQ安装中遇到的坑

    安装步骤是这些: Prerequisite The following softwares are assumed installed: 64bit OS, Linux/Unix/Mac is rec ...

  3. PostGreSQL(1)-源码安装

    目录 简述 一.格式化磁盘 二.源码安装 PostGreSql 1. 安装 readline-devel 2. 安装 PostGresql 3. 设置环境变量 三. 初始化 1. 设置运行用户 2. ...

  4. openlayers一:显示地图与鼠标地理坐标

    openlayers两个好用的开源JS互动地图库之一,另一个是leaflet. openlayers的特点是是大而全,自身包含绝大多数功能,文档好看. leaflet是小而美,自身小,但支持扩展,好用 ...

  5. gitbook 入门教程之快速体验

    本文主要介绍三种使用 gitbook 的方式,分别是 gitbook 命令行工具,Gitbook Editor 官方编辑器和 gitbook.com 官网. 总体来说,三种途径适合各自不同的人群,找到 ...

  6. SQL Server死锁中的会话隔离级别为序列化(Serializable)实验测试

    最近在分析SQL Server的死锁时,发现一个比较有意思的现象,发现死锁当中一个会话的隔离级别为序列化(Serializable),这个是让人比较奇怪的地方,我们知道SQL Server数据库的默认 ...

  7. python3 函数传参练习 全局变量与局部变量 的理解

    额 还是继续抄一边NLP第二条: 2.一个人不能控制另外一个人   一个人不能改变另外一个人,一个人只能改变自己. 每个人的信念,价值观,规条系统只对本人有效,不应强求别人接守. 改变自己,别人才会有 ...

  8. js随机背景颜色

    // 要求: 随机生成颜色RGB 核心点 :(0,0,0) rgb 每一组的数字取值范围是 0~255 // 需要随机生成 0~255 之间的整数 function getRandom(min, ma ...

  9. class基本使用

    console.log(` 1.创建一个空对象 2.让this 指向刚刚创建好的空对象 3.执行构造函数内的代码 (为相关的属性和方法赋值) 4.返回创建好的对象`) // 1.创建一个空对象 // ...

  10. 爬虫框架之Scrapy(一)

    scrapy简介 scrapy是一个用python实现为了爬取网站数据,提取结构性数据而编写的应用框架,功能非常的强大. scrapy常应用在包括数据挖掘,信息处理或者储存历史数据的一系列程序中. s ...