1、Michael1简介基础知识控件覆盖物事件地图图层工具服务坐标转换演示2百度地图API是一套由JavaScript语言编写的应用程序接口，它能够帮助您在网站中构建功能丰富、交互性强的地图应用程序。百度地图API不仅包含构建地图的基本功能接口，还提供了诸如本地搜索、路线规划等数据服务。3通过地址 http:/ 加载API： 其中参数key为密钥，参数v为当前API的版本号，目前最新版本为1.0，services参数表示是否加载服务部分，true表示加载，false表示不加载。4地址 http:/ 中的参数v表示您加载API的版本，例如当前API的最新版本为1.0，则您可在地址中添加 v=1.0。
2、当API升级后，如果已有接口在使用、命名等方面发生了变化，我们会为其增加一个新的版本号（比如1.1），这不会对您现有的应用造成任何影响。如果升级只是修改一些bug或者在不影响现有功能的前提下增加接口，则版本号不会发生变化。5浏览器：IE 6.0+、Firefox 3.0+、Opera 9.0+、Safari 3.0+、Chrome操作系统：Windows、Mac、Linux6一、引用百度地图一、引用百度地图APIAPI文件文件 当您引用地图API文件时，需要使用自己申请的API密钥。 script&services=false 二、创建地图容器元素二、创建地图容器元素div=container
3、地图需要一个HTML元素作为容器，这样才能展现到页面上。这里我们创建了一个div元素并制定它的大小地图会根据容器大小调整自身尺寸。7三、命名空间三、命名空间 API使用BMap作为命名空间，所有类均在该命名空间之下，比如：BMap.MapBMap.Map、BMap.ControlBMap.Control、BMap.OverlayBMap.Overlay。 四、创建地图实例四、创建地图实例varvar mapmap = = newnew BMap.MapBMap.Map( (containercontainer); ); 位于BMap命名空间下的Map类表示地图，通过new操作符可以创建一个地图
4、实例。其参数可以是元素id也可以是元素对象。注意在调用此构造函数时应确保容器元素已经添加到地图上。8五、创建点坐标五、创建点坐标 varvarpoint=point=newnewBMap.Point(116.404,39.915);BMap.Point(116.404,39.915); 这里我们使用BMapBMap命名空间下的PointPoint类来创建一个坐标点。PointPoint类描述了一个地理坐标点，其中116.404表示经度，39.915表示纬度。 六、地图初始化六、地图初始化map.centerAndZoom(point,15);map.centerAndZoom(point,15
5、);在创建地图实例后，我们需要对其进行初始化，BMap.Map.centerAndZoom()BMap.Map.centerAndZoom()方法要求设置中心点坐标和地图级别。地图必须必须经过初始化才可以执行其他操作。9五、创建点坐标五、创建点坐标 varvarpoint=point=newnewBMap.Point(116.404,39.915);BMap.Point(116.404,39.915); 这里我们使用BMapBMap命名空间下的PointPoint类来创建一个坐标点。PointPoint类描述了一个地理坐标点，其中116.404表示经度，39.915表示纬度。 六、地图初始化六
6、、地图初始化map.centerAndZoom(point,15);map.centerAndZoom(point,15);在创建地图实例后，我们需要对其进行初始化，BMap.Map.centerAndZoom()BMap.Map.centerAndZoom()方法要求设置中心点坐标和地图级别。地图必须必须经过初始化才可以执行其他操作。1011百度地图上负责与地图交互的UI元素称为控件控件。百度地图API中提供了丰富的控件，您还可以通过BMap.Control来实现自定义控件。 地图API中提供的控件有：Control：控件的抽象基类抽象基类，所有控件均继承此类的方法、属性。通过此类您可实现自
7、定义控件。NavigationControl：地图平移缩放控件平移缩放控件，默认位于地图左上方，它包含控制地图的平移和缩放的功能。OverviewMapControl：缩略地图控件缩略地图控件，默认位于地图右下方，是一个可折叠的缩略地图。ScaleControl：比例尺控件比例尺控件，默认位于地图左下方，显示地图的比例关系。CopyrightControl：版权控件版权控件，默认位于地图左下方。所有这些控件都基于BMap.Control类。12可以使用BMap.Map.addControl()BMap.Map.addControl()方法向地图添加控件也可以向地图添加多个控件。在本例中我们向地
8、图添加一个平移缩放控件、一个比例尺控件和一个缩略图控件在地图中添加控件后，它们即刻生效。map.addControl(map.addControl(newnewBMap.NavigationControl();BMap.NavigationControl();map.addControl(map.addControl(newnewBMap.ScaleControl();BMap.ScaleControl();map.addControl(map.addControl(newnewBMap.OverviewMapControl();BMap.OverviewMapControl(); 1314所
9、有叠加或覆盖到地图的内容，我们统称为地图覆盖物覆盖物。如标注、矢量图形元素(包括：折线和多边形)、信息窗口等。覆盖物拥有自己的地理坐标，当您拖动或缩放地图时，它们会相应的移动。 地图API提供了如下几种覆盖物： OverlayOverlay：覆盖物的抽象基类抽象基类，此类不可实例化，所有的覆盖物均继承此类的方法。MarkerMarker：标注标注表示地图上的点，可自定义标注的图标。 LabelLabel：表示地图上的文本标注文本标注，您可以自定义标注的文本内容。 PolylinePolyline：表示地图上的折线折线。PolygonPolygon：表示地图上的多边形多边形。多边形类似于闭合的折
10、线，另外您也可以为其添加填充颜色。 InfoWindowInfoWindow：信息窗口信息窗口也是一种特殊的覆盖物。注意：同一时刻只能有一个信息窗口在地图上打开。 可以使用BMap.Map.addOverlay()BMap.Map.addOverlay()方法向地图添加覆盖物，使用BMap.Map.removeOverlay()BMap.Map.removeOverlay()方法移除覆盖物，注意此方法不适用于InfoWindowInfoWindow。 1516百度地图API中的每一个对象都含有addEventListeneraddEventListener方法，您可以通过该方法来监听对象事件。
11、例如，BMap.MapBMap.Map包含 clickclick、dblclickdblclick等事件。在特定环境下这些事件会被触发，同时监听函数会得到相应的事件参数e，比如当用户点击地图时，e e参数会包含鼠标所对 应的地理位置pointpoint。有关地图API对象的事件，请参考完整的API参考文档。 addEventListeneraddEventListener方法有两个参数：监听的事件名称和事件触发时调用的函数。 17地图可以包含一个或多个图层，每个图层在每个级别都是由若干张图块组成的，它们覆盖了地球的整个表面。在最低的缩放级别（级别 1）中，整个地球由 4 张图块组成。随着级别的
12、增长，地图所使用的图块个数也随之增多。 18百度地图中提供一个BMap.TileLayer类，可以实现用户自定义图层功能。可以在百度地图上叠加一层自定义的图块。以下代码在每个图块的所有缩放级别上显示一个简单的透明叠加层，使用浮动红色小水滴表示图块的轮廓。varvarmap=newnewBMap.Map(containercontainer); ; /创建地图实例varvarpoint=newnewBMap.Point(116.404,39.915); /创建点坐标map.centerAndZoom(point,15); /初始化地图，设置中心点坐标和地图级别varvartilelayer=ne
13、wnewBMap.TileLayer(); /创建地图层实例tilelayer.getTilesUrl=functionfunction() /设置图块路径returnreturnlayer.giflayer.gif;map.addTileLayer(tilelayer); /将图层添加到地图上1920百度地图提供了交互功能更为复杂的“工具”，它包括 PushpinTool：标注工具标注工具。通过此工具用户可在地图任意区域添加标注。 DistanceTool：测距工具测距工具。通过此工具用户可测量地图上任意位置之间的距离。 DragAndZoomTool：区域缩放工具区域缩放工具。此工具将根据
14、用户拖拽绘制的矩形区域大小对地图进行放大或缩小操作。 工具类在初始化时需要提供地图实例参数，以便使工具在该地图上生效。您可以在地图上添加多个工具，但同一时刻只能有一个工具处于开启状态。标注工具和测距工具在完成一次操作后将自动退出开启状态，而区域缩放工具可以自行配置是否自动关闭。21varvarmap=map=newnewBMap.MapBMap.Map(container);(container); map.centerAndZoom(newBMap.Point(116.404,39.915),1map.centerAndZoom(newBMap.Point(116.404,39.915),1
15、5);5);varvarmyDis=myDis=newnewBMap.DistanceTool(map);BMap.DistanceTool(map);myDis.open();myDis.open();22地图服务是指那些提供数据信息的接口，比如本地搜索、路线规划等等。百度地图API提供的服务有： LocalSearch：本地搜索本地搜索，提供某一特定地区的位置搜索服务比如在北京市搜索“公园”。TransitRoute：公交导航公交导航，提供某一特定地区的公交出行方案的搜索服务。DrivingRoute：驾车导航驾车导航，提供驾车出行方案的搜索服务。WalkingRoute：步行导航步行导航
16、，提供步行出行方案的搜索服务。Geocoder：地址解析地址解析，提供将地址信息转换为坐标点信息的服务。LocalCity：本地城市本地城市，提供自动判断您所在城市的服务。TrafficControl：实时路况控件实时路况控件，提供实时和历史路况信息服务。搜索类的服务接口需要指定一个搜索范围，否则接口将不能工作。2324因目前各家地图API服务商都沿用不同的坐标体系，故客户在更换API服务商或对各家API性能进行测试的时候会遇到较大的障碍。因此百度地图提供 坐标转换工具，使您可以方便地将不同的坐标体系转换为百度地图标准坐标。极大地降低您更换API服务的成本，同时扩大了可选择范围和自由度。目前百
17、度地图坐标转换工具支持以下API服务商所采用的坐标体系：MapbarMapabc51ditu谷歌25请求接口中有四个参数：fromfrom： 被转换的坐标体系 toto： 转换到这个坐标体系 x x： 经度 y y： 纬度 接口应答中有三个keykey：(应答格式如：error:0,x:116.2610991221,y:29.820560874846)error:0,x:116.2610991221,y:29.820560874846)errorerror： 值为0时，则为成功，非0时，则为失败 x x： 目的经度，即百度坐标经度 y y： 目的纬度，即百度坐标纬度 接口的使用示例谷歌http:/ 51地图： 51地图的坐标，先要除105，然后再调用urlhttp:/
