百度地图开发汇总
地图开发使用汇总
百度官网： https://map.baidu.com/ 开发平台： https://lbsyun.baidu.com/
高德官网： https://www.amap.com/ 开发平台： https://lbs.amap.com/
腾讯官网：https://map.qq.com/ 开放平台：https://lbs.qq.com/
百度地图JavaScript API的不同版本在适用场景、功能特性上存在差异：
版本区别
- API v2.0：基于Canvas渲染，支持2D地图功能，适合普通2D地图开发需求。 12
- API v3.0：在v2.0基础上升级接口，支持更多功能（如叠加图层），同时优化性能。 23
- API GL v1.0：采用WebGL渲染，支持3D地图展示，但因性能要求较高，移动端使用受限。 14
- Lite版本：专为移动端H5页面设计，代码体积小、性能优化，但功能相对基础。 14
适用场景
- PC端开发：优先使用v2.0或v3.0版本，根据功能需求选择。 12
- 移动端开发：若需3D功能且设备性能足够，可选API GL；若追求轻量化，则使用Lite版本。 14
核心差异
- 渲染技术：
- API GL采用WebGL，支持3D地图；
- 普通API版本（v2.0/v3.0）采用Canvas渲染，侧重2D功能。 14
- 性能与体积：
- Lite版本针对移动端优化，代码体积更小；
- API GL对性能要求较高，移动端使用受限。 14
- 功能范围：
- Lite版功能最基础，仅支持移动端H5页面；
- API GL包含3D功能，但部分高级功能需高性能设备支持。 1
应用类型：浏览器 javascript api
应用类型：服务端 web api
一。应用类型：浏览器 javascript api
基础地图展现
覆盖物
地图事件
变更地图样式
搜索兴趣点
数据可视化
1.百度地图提供了各种平台的SDK，
地址：https://lbsyun.baidu.com/ 如下：
2.创建地图的基本步骤如下：
编写HTML页面的基础代码
引入百度地图API文件
初始化地图逻辑以及设置各种参数
参考官方文档：https://lbsyun.baidu.com/index.php?title=jspopularGL/guide/show
2.1案例1：添加控件
控件是负责与地图交互的UI元素，百度地图API支持比例尺、缩放、定位、城市选择列表、版权，以及自定义控件。
文档：https://lbsyun.baidu.com/index.php?title=jspopularGL/guide/widget
2.2案例2：添加覆盖物
所有叠加或覆盖到地图的内容，我们统称为地图覆盖物。覆盖物拥有自己的地理坐标，当您拖动或缩放地图时，它们会相应的移动。目前JSAPI GL版支持的覆盖物以基本图形为主。文档：https://lbsyun.baidu.com/index.php?title=jspopularGL/guide/addOverlay
2.3案例3：地图事件
百度地图API拥有一个自己的事件模型，程序员可监听地图API对象的自定义事件，使用方法和DOM事件类似。但请注意，地图API事件是独立的，与标准DOM事件不同。文档：
https://lbsyun.baidu.com/index.php?title=jspopularGL/guide/event
2.4案例4：地图样式
百度地图支持设置地图样式，比如将地图设置为地球模式，文档：
https://lbsyun.baidu.com/index.php?title=jspopularGL/guide/maptype
2.5案例5：地图检索
百度地图支持在地图中兴趣点的检索服务，示例：
https://lbsyun.baidu.com/jsdemo.htm#localSearchKey
北京市“银行”关键字的检索结果，
并展示在地图上
2.6案例5：地图检索 圆形范围检索
百度地图支持在地图中兴趣点的检索服务，示例：https://lbsyun.baidu.com/jsdemo.htm#localSearchKeyCircle
北京市地图上圆形覆盖范围内的“景点”
检索结果，并展示在地图上
2.7案例6：数据可视化
MapVGL，是一款基于WebGL的地理信息可视化库，可以用来展示大量基于3D的地理信息点线面数据。
文档：https://lbsyun.baidu.com/solutions/mapvdata
二。应用类型：服务端 web api
创建服务端的应用
坐标转换
IP定位服务
地点输入提示服务
路线规划
1.案例1：坐标转换
目前中国主要有以下三种坐标系：
WGS84：为一种大地坐标系，也是目前广泛使用的GPS全球卫星定位系统使用的坐标系
GCJ02：是由中国国家测绘局制订的地理信息系统的坐标系统，由WGS84坐标系经加密后的坐标系
BD09：为百度坐标系，在GCJ02坐标系基础上再次加密，其中bd09ll表示百度经纬度坐标，bd09mc表示百度墨卡托米制坐标
Web api中提供了将非百度坐标转换成百度坐标体系的接口服务。
文档：https://lbsyun.baidu.com/index.php?title=webapi/guide/changeposition
2.案例2：IP定位服务
普通IP定位是一套以HTTP/HTTPS形式提供的轻量级定位接口，用户可以通过该服务，根据IP定位来获取大致位置。
文档：https://lbsyun.baidu.com/index.php?title=webapi/ip-api
3.案例3：地点输入提示服务
用户可通过该服务，匹配用户输入关键词的地点推荐列表。
文档：https://lbsyun.baidu.com/index.php?title=webapi/place-suggestion-api
4.案例4：路线规划
路线规划服务（又名Direction API）是一套REST风格的Web服务API，以HTTP/HTTPS形式提供了路线规划服务。目前，Direction API支持公交、骑行、驾车路线规划，Direction API支持中国大陆地区。
文档：https://lbsyun.baidu.com/index.php?title=webapi/direction-api-v2
清华大学 到 北京工人体育场
三。地图搜索案例：地图找房
地图找房的功能
搭建MongoDB环境
BMapGLLib
构造数据
MongoDB的聚合查询
实现搜索功能
在房源信息类网站中，为了方便用户查找房源，推出了地图找房的功能，房源数据展示更加的直观。
例如：链家网：https://map.lianjia.com/map/310000/ESF/
功能特点：
在可视范围内展现房源数据。
在地图缩放或拖拽时，重新查询房源数据。
不同的地图比例尺聚合展现的数据维度不同，例如：按照行政区、按商圈、按小区名等。
BMapGLLib是基于百度地图JSAPI GL版的JavaScript开源工具库。
代码地址：https://github.com/huiyan-fe/BMapGLLib
静态页面实现的基本思路步骤：
第一步，加载百度地图，需要开启滚轮功能以及显示比例尺；
第二步，给地图添加拖拽、缩放事件，来控制覆盖物的显示；
第三步，通过百度地图的BMapGLLib工具库中的RichMarker（富标注），显示自定义覆盖物。
第四步，通过ajax异步加载数据，动态生成覆盖物，在地图上展现出来。
搭建MongoDB环境
地图找房案例中的数据存储到MongoDB中，我们通过Docker的方式部署安装MongoDB。
具体安装方法参考资料目录中的《docker安装MongoDB.md》文件。
在application.properties中引入spring-data-mongodb的配置。
构造数据
为了数据的真实性，我们从网上抓取一些小区的数据，小区的位置数据通过百度地图API获取
MongoDB的聚合操作是以管道的形式完成的，在一个管道处理完毕后将结果传递给下一个管道处理。
常用的聚合操作有：
$project：修改输入文档的结构。可以用来重命名、增加或删除域，也可以用于创建计算结果以及嵌套文档。
$match：用于过滤数据，只输出符合条件的文档。$match使用MongoDB的标准查询操作。
$limit：用来限制MongoDB聚合管道返回的文档数。
$skip：在聚合管道中跳过指定数量的文档，并返回余下的文档。
$unwind：将文档中的某一个数组类型字段拆分成多条，每条包含数组中的一个值。
$group：将集合中的文档分组，可用于统计结果。
$sort：将输入文档排序后输出。
$geoNear：输出接近某一地理位置的有序文档。
MongoDB的聚合操作符主要用于处理数据(诸如统计平均值,求和等)，并返回计算后的数据结果。
类似SQL语句中的 count(*)操作，常用操作如下：
表达式 描述 实例
$sum 计算总和。 db.mycol.aggregate([{$group : {_id : "$by_user", num_tutorial : {$sum : "$likes"}}}])
$avg 计算平均值 db.mycol.aggregate([{$group : {_id : "$by_user", num_tutorial : {$avg : "$likes"}}}])
$min 获取集合中所有文档对应值得最小值。 db.mycol.aggregate([{$group : {_id : "$by_user", num_tutorial : {$min : "$likes"}}}])
$max 获取集合中所有文档对应值得最大值。 db.mycol.aggregate([{$group : {_id : "$by_user", num_tutorial : {$max : "$likes"}}}])
$push 在结果文档中插入值到一个数组中。 db.mycol.aggregate([{$group : {_id : "$by_user", url : {$push: "$url"}}}])
$addToSet 在结果文档中插入值到一个数组中，但不创建副本。 db.mycol.aggregate([{$group : {_id : "$by_user", url : {$addToSet : "$url"}}}])
$first 根据资源文档的排序获取第一个文档数据。 db.mycol.aggregate([{$group : {_id : "$by_user", first_url : {$first : "$url"}}}])
$last 根据资源文档的排序获取最后一个文档数据 db.mycol.aggregate([{$group : {_id : "$by_user", last_url : {$last : "$url"}}}])
实现搜索 – 分析
实现搜索的关键点：
通过矩形的对角的坐标可以确定矩形搜索范围。
需要按照不同的地图比例尺进行分组聚合查询，通过按照行政区、商圈或小区名进行分组，聚合数量、价格等数据。
响应的数据如下：
四。新增电子围栏
新增电子围栏
查询电子围栏列表（2个接口）
更新电子围栏
删除电子围栏
电子围栏的主要用途是监控车辆是否超出规定的范围，如果超出需要有异常的状态信息。
电子围栏需要使用到百度地图鹰眼服务中的服务，并在围栏数据也需要在本地存储。
百度地图文档地址：https://lbsyun.baidu.com/index.php?title=yingyan/api/v3/geofence
百度地图电子围栏支持圆形、多边形、路线、行政区类型的围栏，在项目中我们只演示多边形围栏的使用，其他的类似。
围栏面积如果超过100平方公里，就需要付费申请开通权限。
接口地址：https://mock-java.itheima.net/project/3308/interface/api/41710
接口提交的参数有围栏名称以及多边形坐标数据。
删除电子围栏需要将百度地图以及MongoDB中的围栏数据均删除。
百度地图API接口：https://lbsyun.baidu.com/index.php?title=yingyan/api/v3/geofence#service-page-anchor11
来源：https://www.cnblogs.com/chenshaojun2008/p/17985696
浙公网安备 33010602011771号