医学百度地图API开发指南PPT培训课件

,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,百度地图API开发指南,简介,基础知识,控件,覆盖物,事件,地图图层,工具,服务,坐标转换,演示,目录,百度地图API是一套由JavaScript语言编写的应用程序接口，它能够帮助您在网站中构建功能丰富、交互性强的地图应用程序。,百度地图API不仅包含构建地图的基本功能接口，还提供了诸如本地搜索、路线规划等数据服务。,简介,什么是百度地图,API,？,通过地址,http:/ 6.0+、Firefox 3.0+、Opera 9.0+、Safari 3.0+、Chrome,操作系统：Windows、Mac、Linux,简介,兼容性,一、引用百度地图,API,文件,当您引用地图,API,文件时，需要使用自己申请的,API,密钥。,二、创建地图容器元素,地图需要一个,HTML,元素作为容器，这样才能展现到页面上。这里我们创建了一个,div,元素并制定它的大小地图会根据容器大小调整自身尺寸。,基础知识,百度地图的“,Hello,World”,三、命名空间,API,使用,BMap,作为命名空间，所有类均在该命名空间之下，比如：,BMap.Map,、,BMap.Control,、,BMap.Overlay,。,四、创建地图实例,var,map,=,new,BMap.Map,(,container,);,位于,BMap,命名空间下的,Map,类表示地图，通过,new,操作符可以创建一个地图实例。其参数可以是元素,id,也可以是元素对象。注意在调用此构造函数时应确保容器元素已经添加到地图上。,基础知识,百度地图的“,Hello,World”,五、创建点坐标,var,point=,new,BMap.Point(116.404,39.915);,这里我们使用,BMap,命名空间下的,Point,类来创建一个坐标点。,Point,类描述了一个地理坐标点，其中,116.404,表示经度，,39.915,表示纬度。,六、地图初始化,map.centerAndZoom(point,15);,在创建地图实例后，我们需要对其进行初始化，,BMap.Map.centerAndZoom(),方法要求设置中心点坐标和地图级别。地图,必须,经过初始化才可以执行其他操作。,基础知识,百度地图的“,Hello,World”,五、创建点坐标,var,point=,new,BMap.Point(116.404,39.915);,这里我们使用,BMap,命名空间下的,Point,类来创建一个坐标点。,Point,类描述了一个地理坐标点，其中,116.404,表示经度，,39.915,表示纬度。,六、地图初始化,map.centerAndZoom(point,15);,在创建地图实例后，我们需要对其进行初始化，,BMap.Map.centerAndZoom(),方法要求设置中心点坐标和地图级别。地图,必须,经过初始化才可以执行其他操作。,基础知识,百度地图的“,Hello,World”,基础知识,百度地图的“,Hello,World”,百度地图上负责与地图交互的,UI,元素称为,控件,。百度地图,API,中提供了丰富的控件，您还可以通过,BMap.Control,来实现自定义控件。,地图,API,中提供的控件有：,Control,：控件的,抽象基类,，所有控件均继承此类的方法、属性。通过此类您可实现自定义控件。,NavigationControl,：地图,平移缩放控件,，默认位于地图左上方，它包含控制地图的平移和缩放的功能。,OverviewMapControl,：,缩略地图控件,，默认位于地图右下方，是一个可折叠的缩略地图。,ScaleControl,：,比例尺控件,，默认位于地图左下方，显示地图的比例关系。,CopyrightControl,：,版权控件,，默认位于地图左下方。,所有这些控件都基于,BMap.Control,类。,控件,地图控件概述,可以使用,BMap.Map.addControl(),方法向地图添加控件也可以向地图添加多个控件。在本例中我们向地图添加一个平移缩放控件、一个比例尺控件和一个缩略图控件在地图中添加控件后，它们即刻生效。,map.addControl(,new,BMap.NavigationControl();,map.addControl(,new,BMap.ScaleControl();,map.addControl(,new,BMap.OverviewMapControl();,控件,向地图添加控件,控件,向地图添加控件,所有叠加或覆盖到地图的内容，我们统称为地图,覆盖物,。如标注、矢量图形元素,(,包括：折线和多边形,),、信息窗口等。覆盖物拥有自己的地理坐标，当您拖动或缩放地图时，它们会相应的移动。,地图,API,提供了如下几种覆盖物：,Overlay,：覆盖物的,抽象基类,，此类不可实例化，所有的覆盖物均继承此类的方法。,Marker,：,标注,表示地图上的点，可自定义标注的图标。,Label,：表示地图上的,文本标注,，您可以自定义标注的文本内容。,Polyline,：表示地图上的,折线,。,Polygon,：表示地图上的,多边形,。多边形类似于闭合的折线，另外您也可以为其添加填充颜色。,InfoWindow,：,信息窗口,也是一种特殊的覆盖物。注意：同一时刻只能有一个信息窗口在地图上打开。,可以使用,BMap.Map.addOverlay(),方法向地图添加覆盖物，使用,BMap.Map.removeOverlay(),方法移除覆盖物，注意此方法不适用于,InfoWindow,。,覆盖物,地图覆盖物概述,覆盖物,地图覆盖物概述,百度地图,API,中的每一个对象都含有,addEventListener,方法，您可以通过该方法来监听对象事件。例如，,BMap.Map,包含,click,、,dblclick,等事件。在特定环境下这些事件会被触发，同时监听函数会得到相应的事件参数,e,，比如当用户点击地图时，,e,参数会包含鼠标所对 应的地理位置,point,。,有关地图,API,对象的事件，请参考完整的,API,参考文档。,addEventListener,方法有两个参数：监听的事件名称和事件触发时调用的函数。,事件,事件的监听,地图可以包含一个或多个图层，每个图层在每个级别都是由若干张图块组成的，它们覆盖了地球的整个表面。,在最低的缩放级别（级别,1,）中，整个地球由,4,张图块组成。随着级别的增长，地图所使用的图块个数也随之增多。,地图图层,地图图层概念,百度地图中提供一个,BMap.TileLayer,类，可以实现用户自定义图层功能。可以在百度地图上叠加一层自定义的图块。,以下代码在每个图块的所有缩放级别上显示一个简单的透明叠加层，使用浮动红色小水滴表示图块的轮廓。,var,map=,new,BMap.Map,(,container,),;,/,创建地图实例,var,point=,new,BMap.Point(116.404,39.915);,/,创建点坐标,map.centerAndZoom(point,15);,/,初始化地图，设置中心点坐标和地图级别,var,tilelayer=,new,BMap.TileLayer();,/,创建地图层实例,tilelayer.getTilesUrl=,function,(),/,设置图块路径,return,layer.gif,;,map.addTileLayer(tilelayer);,/,将图层添加到地图上,地图图层,自定义图层,地图图层,自定义图层,百度地图提供了交互功能更为复杂的“工具”，它包括,PushpinTool,：,标注工具,。通过此工具用户可在地图任意区域添加标注。,DistanceTool,：,测距工具,。通过此工具用户可测量地图上任意位置之间的距离。,DragAndZoomTool,：,区域缩放工具,。此工具将根据用户拖拽绘制的矩形区域大小对地图进行放大或缩小操作。,工具类在初始化时需要提供地图实例参数，以便使工具在该地图上生效。您可以在地图上添加多个工具，但同一时刻只能有一个工具处于开启状态。标注工具和测距工具在完成一次操作后将自动退出开启状态，而区域缩放工具可以自行配置是否自动关闭。,工具,地图工具概述,var,map=,new,BMap.Map,(container);,map.centerAndZoom(newBMap.Point(116.404,39.915),15);,var,myDis=,new,BMap.DistanceTool(map);,myDis.open();,工具,向地图添加工具,地图服务是指那些提供数据信息的接口，比如本地搜索、路线规划等等。百度地图,API,提供的服务有：,LocalSearch,：,本地搜索,，提供某一特定地区的位置搜索服务比如在北京市搜索“公园”。,TransitRoute,：,公交导航,，提供某一特定地区的公交出行方案的搜索服务。,DrivingRoute,：,驾车导航,，提供驾车出行方案的搜索服务。,WalkingRoute,：,步行导航,，提供步行出行方案的搜索服务。,Geocoder,：,地址解析,，提供将地址信息转换为坐标点信息的服务。,LocalCity,：,本地城市,，提供自动判断您所在城市的服务。,TrafficControl,：,实时路况控件,，提供实时和历史路况信息服务。,搜索类的服务接口需要指定一个搜索范围，否则接口将不能工作。,服务,地图服务概述,服务,结果面板,因目前各家地图,API,服务商都沿用不同的坐标体系，故客户在更换,API,服务商或对各家,API,性能进行测试的时候会遇到较大的障碍。因此百度地图提供 坐标转换工具，使您可以方便地将不同的坐标体系转换为百度地图标准坐标。极大地降低您更换,API,服务的成本，同时扩大了可选择范围和自由度。,目前百度地图坐标转换工具支持以下,API,服务商所采用的坐标体系：,Mapbar,Mapabc,51ditu,谷歌,坐标转换,坐标转换概述,请求接口中有四个参数：,from,：被转换的坐标体系,to,：转换到这个坐标体系,x,：经度,y,：纬度,接口应答中有三个,key,：,(,应答格式如：,error:0,x:116.2610991221,y:29.820560874846),error,：值为,0,时，则为成功，非,0,时，则为失败,x,：目的经度，即百度坐标经度,y,：目的纬度，即百度坐标纬度,接口的使用示例,谷歌,http:/