第11章-百度地图开发

WebGIS原理与应用朱进苏州科技大学环境学院2024年5月30日第11章百度地图开发2024/5/30slide2内容11.1百度地图开发概述11.2百度地图JSAPI11.3LBS云11.4Web服务API11.5鹰眼轨迹11.6静态图API11.7URIAPI2024/5/30slide3目标掌握百度地图JSAPI的HelloWorld示例及主要架构熟悉百度地图JS开源库的主要功能熟悉百度地图的LBS云、Web服务API熟悉百度地图的鹰眼轨迹、静态图API、URIAPI2024/5/30slide411.1百度地图开发概述2024/5/30slide5百度地图开发概述2024/5/30slide6百度地图开发概述http:///2024/5/30slide7百度地图开发概述2024/5/30slide8解决方案O2O与LBSO2O:OnlineToOffline，线上线下电子商务，比如团购，外卖等2024/5/30slide9解决方案O2O与LBS各个功能对应到地图开放平台的服务2024/5/30slide10解决方案O2O与LBS各个功能对应到地图开放平台的服务2024/5/30slide11解决方案O2O与LBS各个功能对应到地图开放平台的服务2024/5/30slide12百度地图开发概述2024/5/30slide13百度地图开发概述房地产网站百度认为用户通过房地产网站或APP获取信息的简单体验流程为：搜索—选定目标—详情—实地参观。2024/5/30slide14百度地图开发概述房地产网站-场景2024/5/30slide15百度地图开发概述房地产网站-场景2024/5/30slide16百度地图开发概述房地产网站-场景2024/5/30slide17百度地图开发概述房地产网站-场景2024/5/30slide18百度地图开发概述房地产网站-场景2024/5/30slide1911.2百度地图JSAPI2024/5/30slide20百度地图JSAPIJSAPI大众版http:///index.php?title=jspopular免费提供，可在网站中构建功能丰富、交互性强的地图应用同时支持支持PC端和移动端支持HTML5特性的地图开发2024/5/30slide21百度地图JSAPIJSAPI极速版http:///map/jsmobile.htm专为手机浏览器提供的API较JavaScriptAPI大众版而言，该版更适配移动设备，体积更小，加载地图速度更快，更省流量较移动端常采用的静态图API，该版本可加载动态地图，进行地图操作，如拖拽、缩放、检索、线路规划等，更好满足用户对地图的丰富需求。2024/5/30slide22百度地图JSAPI大众版获取密钥前提：注册百度账号2024/5/30slide23百度地图JSAPI大众版获取密钥http:///apiconsole/key?application=key2024/5/30slide24百度地图JSAPI大众版获取密钥2024/5/30slide25百度地图JSAPI大众版获取密钥2024/5/30slide26百度地图JSAPI大众版使用密钥2024/5/30slide27百度地图JSAPI大众版功能2024/5/30slide28百度地图JSAPI大众版功能2024/5/30slide29百度地图JSAPI大众版功能2024/5/30slide30百度地图JSAPI大众版百度地图的“Hello,World”2024/5/30slide31百度地图JSAPI大众版百度地图的“Hello,World”准备页面-使用最新的符合HTML5规范的文档声明也可以根据需要选择其他类型的文档声明，这样浏览器会以标准的方式对页面进行渲染，保证页面最大的兼容性2024/5/30slide32百度地图JSAPI大众版百度地图的“Hello,World”添加一个meta标签，以便使页面更好的在移动平台上展示设置样式，使地图充满整个浏览器窗口2024/5/30slide33百度地图JSAPI大众版百度地图的“Hello,World”引用百度地图API文件创建地图容器元素，创建一个div元素API使用BMap作为命名空间，所有类均在该命名空间之下，比如：BMap.Map、BMap.Control、BMap.Overlay。2024/5/30slide34百度地图JSAPI大众版百度地图的“Hello,World”创建地图实例其参数可以是元素id也可以是元素对象创建点坐标Point类描述了一个地理坐标点，其中116.404表示经度，39.915表示纬度。2024/5/30slide35百度地图JSAPI大众版百度地图的“Hello,World”地图初始化在创建地图实例后，需要对其进行初始化，BMap.Map.centerAndZoom()方法要求设置中心点坐标和地图级别。地图必须经过初始化才可以执行其他操作。2024/5/30slide36百度地图JSAPI大众版百度地图的“Hello,World”地图配置与操作可以修改配置来改变地图操作功能，比如，默认情况下地图不支持鼠标滚轮缩放操作，因为这样可能会影响整个页面的用户体验如果希望在地图中使用鼠标滚轮控制缩放，则可以调用map.enableScrollWheelZoom方法来开启2024/5/30slide37百度地图JSAPI大众版百度地图的“Hello,World”示例显示一个地图，等待两秒钟后，它会移动到新中心点2024/5/30slide38百度地图JSAPI大众版控件百度地图上负责与地图交互的UI元素称为控件Control：控件的抽象基类，所有控件均继承此类的方法、属性。通过此类您可实现自定义控件。NavigationControl：地图平移缩放控件，PC端默认位于地图左上方，它包含控制地图的平移和缩放的功能。OverviewMapControl：缩略地图控件2024/5/30slide39百度地图JSAPI大众版控件ScaleControl：比例尺控件，显示地图的比例关系。MapTypeControl：地图类型控件，默认位于地图右上方。CopyrightControl：版权控件，默认位于地图左下方。GeolocationControl：定位控件，针对移动端开发,默认位于地图左下方。2024/5/30slide40百度地图JSAPI大众版控件使用Map.addControl()方法向地图添加控件,在此之前地图需要进行初始化向地图添加多个控件2024/5/30slide41百度地图JSAPI大众版覆盖物所有叠加或覆盖到地图的内容，统称为地图覆盖物(Overlay)如标注、矢量图形元素(包括：折线和多边形和圆)、信息窗口等。覆盖物拥有自己的地理坐标，当拖动或缩放地图时，它们会相应的移动2024/5/30slide42百度地图JSAPI大众版覆盖物Overlay：覆盖物的抽象基类，所有的覆盖物均继承此类的方法。Label：表示地图上的文本标注，您可以自定义标注的文本内容。Marker：标注表示地图上的点，可自定义标注的图标。Polyline：表示地图上的折线。Polygon：表示地图上的多边形，类似于闭合的折线，也可为其添加填充颜色。2024/5/30slide43百度地图JSAPI大众版覆盖物Circle:表示地图上的圆。InfoWindow：可以展示更为丰富的文字和多媒体信息。注意：同一时刻只能有一个信息窗口在地图上打开。使用map.addOverlay方法向地图添加覆盖物，使用map.removeOverlay方法移除覆盖物，注意此方法不适用于InfoWindow。2024/5/30slide44百度地图JSAPI大众版覆盖物以下示例向地图中心点添加了一个标注，并使用默认的标注样式2024/5/30slide45百度地图JSAPI大众版覆盖物可使用InfoWindow来创建一个信息窗实例2024/5/30slide46百度地图JSAPI大众版事件大部分对象都含有addEventListener方法，您可以通过该方法来监听对象事件BMap.Map包含click、dblclick等事件。在特定环境下这些事件会被触发，同时监听函数会得到相应的事件参数e，比如当用户点击地图时，e参数会包含鼠标所对应的地理位置point。2024/5/30slide47百度地图JSAPI大众版事件addEventListener方法有两个参数：监听的事件名称和事件触发时调用的函数2024/5/30slide48百度地图JSAPI大众版地图图层目前百度地图提供的图层有TrafficLayer(交通流量图层)通过map.addTileLayer方法可向地图添加图层2024/5/30slide49百度地图JSAPI大众版地图服务地图服务指提供数据信息的接口，比如本地搜索、路线规划等LocalSearch：本地搜索，提供某一特定地区的位置搜索服务，比如在北京市搜索“公园”。TransitRoute：公交导航，提供某一特定地区的公交出行方案的搜索服务。DrivingRoute：驾车导航，提供驾车出行方案的搜索服务。2024/5/30slide50百度地图JSAPI大众版地图服务WalkingRoute：步行导航，提供步行出行方案的搜索服务。Geocoder：地址解析，提供将地址信息转换为坐标点信息的服务。LocalCity：本地城市，提供自动判断您所在城市的服务。TrafficControl：实时路况控件，提供实时和历史路况信息服务。2024/5/30slide51百度地图JSAPI大众版地图服务BMap.LocalSearch提供本地搜索服务，在使用本地搜索时需要为其设置一个检索区域，检索区域可以是BMap.Map对象、BMap.Point对象或者是省市名称（比如："北京市"）的字符串。2024/5/30slide52百度地图JSAPI大众版地图服务地理编码将地址信息转换为地理坐标点信息提供Geocoder类进行地址解析，通过Geocoder.getPoint()方法来将一段地址描述转换为一个坐标。2024/5/30slide53百度地图JSAPI大众版地图服务示例获得地址“北京市海淀区上地10街10号”的地理坐标位置，并在这个位置上添加一个标注。注意在调用Geocoder.getPoint()方法时需要提供地址解析所在的城市（本例为“北京市”）。2024/5/30slide54百度地图JSAPI大众版全景图百度全景地图提供沿着全景覆盖城市指定道路、指定位置点360度的全景视图，相比二维地图全景图更加真实、直观2024/5/30slide55百度地图JSAPI大众版全景图通过全景控件可以从普通地图进入全景地图，添加全景控件的方式同添加工具条等控件类似2024/5/30slide56百度地图JSAPI大众版示例Demo2024/5/30slide57百度地图JSAPI大众版JavaScript开源库百度地图JavaScript开源库，是一套基于百度地图API二次开发的开源的代码库。目前提供多个lib库，帮助开发者快速实现在地图上添加Marker、自定义信息窗口、标注相关开发、快速加载城市列表、拉框放大、拉框搜索、区域限制设置、几何运算、实时交通、检索与公交驾车查询、鼠标绘制工具等功能。2024/5/30slide58百度地图JSAPI大众版JavaScript开源库-大数据可视化库Mapv是一组基于百度地图的大数据可视化库，可以用来展示大量的点、线、面数据，每种数据也有不同的展示类型，如直接打点、热力图、网格、聚合等方式展示数据。2024/5/30slide59百度地图JSAPI大众版JavaScript开源库-热力图提供热力图可视化展现功能，注:支持chrome,safari,IE9及以上的浏览器.核心的代码主要来自于第三方heatmap.js,主入口类是HeatmapOverlay，基于BaiduMapAPI2.0。2024/5/30slide60百度地图JSAPI大众版JavaScript开源库-鼠标绘制工具条库提供鼠标绘制点、线、面、多边形（矩形、圆）的编辑工具条的开源代码库。且用户可使用JavaScriptAPI对应覆盖物（点、线、面等）类接口对其进行属性（如颜色、线宽等）设置、编辑（如开启线顶点编辑等）等功能。2024/5/30slide6111.3LBS云2024/5/30slide62LBS云概述LBS.云是百度地图针对LBS开发者推出的平台级服务，结合已有的地图API和SDK服务，通过开放服务端存储和计算能力，提供海量位置数据的实时存储、检索、展示一体化解决方案。2024/5/30slide63LBS云功能-云端存储无须部署服务器，通过云存储API或LBS云数据管理平台即可完成海量数据云端存储。免费开放千万级数据存储空间支持单个数据表百G存储空间支持每秒万级并发读写。2024/5/30slide64LBS云功能-地理检索基于云端健壮的地理计算能力，实现海量数据的实时云检索支持周边、区域等多种检索方式开放高性能大数据计算集群，实现云端数据实时检索2024/5/30slide65LBS云功能-地图展示通过云麻点服务，快速实现海量位置数据地图展示开放云端渲染引擎的计算能力，实现亿万级数据渲染支持Web、Android、iOS的多端同步展示2024/5/30slide66CustomLayer是用户自定义底图层，现阶段主要为LBS云麻点功能展现服务。11.4Web服务API2024/5/30slide67Web服务API概述百度地图Web服务API为开发者提供http接口，即开发者通过http形式发起检索请求，获取返回json或xml格式的检索数据。用户可以基于此开发JavaScript、C#、C++、Java等语言的地图应用。2024/5/30slide68Web服务API功能2024/5/30slide69Web服务API功能2024/5/30slide70Web服务APIPlaceAPIPlaceAPI是一类简单的HTTP接口，用于返回查询某个区域的某类POI数据，且提供单个POI的详情查询服务，用户可以使用C#、C++、Java等开发语言发送HTTP请求且接收json、xml的数据。2024/5/30slide71Web服务APIPlaceAPI-Hello,World示例以下是一个关于placeAPI的简单示例，设置检索城市为北京，检索关键字为“饭店”，检索后返回10条数据。URL：http:///place/v2/search?q=饭店®ion=北京&output=json&ak={您的密钥}2024/5/30slide72Web服务APIGeocodingAPIGeocodingAPI是一类简单的HTTP接口，用于提供从地址到经纬度坐标或者从经纬度坐标到地址的转换服务，用户可以使用C#、C++、Java等开发语言发送HTTP请求且接收JSON、XML的返回数据。2024/5/30slide73Web服务APIGeocodingAPI发送一个地址是“百度大厦”的请求，返回该地址对应的地理坐标。URL：/geocoder/v2/?address=北京市海淀区上地十街10号&output=json&ak=E4805d16520de693a3fe707cdc962045&callback=showLocation2024/5/30slide7411.5鹰眼轨迹2024/5/30slide75鹰眼轨迹概述一套高性能轨迹存储和查询服务，开发者可迅速的开发一套轨迹追踪系统。在轨迹采集时，鹰眼支持手机、可穿戴设备和车载OBD设备这三种方式进行轨迹采集并上传；对于开发者通过其他方式采集的轨迹，可通过鹰眼Web服务API上传轨迹至鹰眼云端进行存储应用案例:物流行业,O2O上门服务,车联网，生活服务(儿童手表)等。2024/5/30slide76鹰眼轨迹鹰眼轨迹服务结构示意图2024/5/30slide77鹰眼轨迹功能轨迹追踪：借助GPS、基站、Wi-Fi和传感器信息，实现室内、外高精度的连续轨迹追踪轨迹回传：采用TCP长连接、数据打包压缩、加密回传等策略，保障数据安全，实现超低流量损耗。2024/5/30slide78鹰眼轨迹功能轨迹纠偏：实时进行轨迹纠偏，解决定位漂移问题，还原真实轨迹。轨迹查询：实时查询被追踪者轨迹地理围栏报警：当被追踪者进入、离开该区域时，监控者可以接收到自动报警通知。2024/5/30slide7911.6静态图API2024/5