百度地图API手册
百度地图API示例之设置地图显示范围
百度地图API⽰例之设置地图显⽰范围代码<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><meta name="viewport" content="initial-scale=1.0, user-scalable=no"/><style type="text/css">body, html {width: 100%;height: 100%;margin:0;font-family:"微软雅⿊";}#allmap{width:100%;height:500px;}p{margin-left:5px; font-size:14px;}</style><script type="text/javascript" src="/api?v=2.0&ak=sSelQoVi2L3KofLo1HOobonW"></script><script type="text/javascript" src="/library/AreaRestriction/1.2/src/AreaRestriction_min.js"></script><title>设置地图显⽰范围</title></head><body><div id="allmap"></div><p>将地图显⽰范围设定在指定区域,地图拖出该区域后会重新弹回。
简单使用百度API生成地图步骤
//向地图中添加缩略图控件
var ctrl_ove = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:1});
map.addControl(ctrl_ove);
window.map = map;//将map变量存储在全局
}
//地图事件设置函数:
function setMapEvent(){
map.enableDragging();//启用地图拖拽事件,默认启用(可不写)
map.enableScrollWheelZoom();//启用地图滚轮放大缩小
map.enableDoubleClickZoom();//启用鼠标双击放大,默认启用(可不写)
map.enableKeyboard();//启用键盘上下左右键移动地图
}
//地图控件添加函数:
function addMapControl(){
//向地图中添加缩放控件
var ctrl_nav = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_PAN});
}
//创建地图函数:
function createMap(){
var map = new BMap.Map("doint = new BMap.Point(120.365872,31.545238);//定义一个中心点坐标
map.centerAndZoom(point,17);//设定地图的中心点和坐标并将地图显示在地图容器中
百度地图api使用文档marker标注label使用
引入百度api<script type="text/javascript" src=".com/api?v=1.4"></script> 1.4api版本<script type="text/javascript" src=".com/library/MapWrapper/1.2/src/"></script> 转化gps坐标google坐标用初始化地图var myMap = new BMap.Map("divMap"); //divMap为要在id为divMap的div中myMap.centerAndZoom(new BMap.Point(116.404, 39.915), 12);//地图显示中心坐标为116.404,39.915,放大级别为12myMap.enableScrollWheelZoom(); //允许鼠标滚轮滑动放大缩小地图label添加var point=new BMap.Point(116.404, 39.915);//label显示的位置var myLabel = new bel("海辉房产21000元", //为lable填写内容{offset:new BMap.Size(-60,-60), //label的偏移量,为了让label的中心显示在点上position:point}); //label的位置myLabel.setTitle("我是文本标注label");myLabel.setTitle("我是文本标注label");//为label添加鼠标提示myLabel.setStyle({ //给label设置样式,任意的CSS都是可以的"color":"red", //颜色"fontSize":"14px", //字号"border":"0", //边"height":"120px", //高度" width":"125px", //宽"textAlign":"center", //文字水平居中显示1"lineHeight":"120px", //行高,文字垂直居中显示"background":"url(/icons/CrystalClear/128x128/actions/gohome.png)", //背景图片,这是房产标注的关键!"cursor":"pointer"});myMap.addOverlay(myLabel); //把label添加到地图上以上设置效果如图1添加自定义marker自定义marker图标样式默认为红色水滴形式下面代码为更改图标样式var iconSelf = new BMap.Icon('self.png', new BMap.Size(20, 32), { //设置图标显示图片anchor: new BMap.Size(10, 30)var mkrSelf = new BMap.Marker(new BMap.Point(116.250 + i * 0.01, 39.910), { //设置位置icon: iconSelf});myMap.addOverlay(mkrSelf); //添加到地图中设置效果如下默认图标如下添加maker监听鼠标放上事件及显示信息mkrSelf .addEventListener("mouseover", function(){var infoWin = new Window("Person" + i);//定义显示信息this.openInfoWindow(infoWin);});效果如下3。
百度地图API应用实例说明文档
百度地图API百度地图API应用实例Michael Tian目录百度地图API (3)1基础知识 (3)1.1 百度地图 API 概念 (3)1.2 百度地图的“Hello, World” (3)1.2.1 引用百度地图API文件 (5)1.2.2创建地图容器元素 (5)1.2.3命名空间 (5)1.2.4创建地图实例 (5)1.2.5创建点坐标 (6)1.2.6 初始化地图 (6)1.2.7地图操作 (6)2应用示例 (6)2.1 Map类 (7)2.2 ExtJs (7)2.2.1 将百度地图嵌入到Ext中 (8)2.2.2 在Ext中显示百度地图 (10)2.3 向地图添加标注 (10)2.4 为标注添加信息窗口 (11)2.5 标注与数据列表的联动 (12)2.6 数据列表与标注的联动 (12)2.7 创建可拖拽的标注 (14)3折线 (14)3.1添加多边形 (14)3.2样式设置 (16)4自定义标注 (16)5 文本标注 (17)5.1 添加一个文本标注 (17)5.2 文本位置偏移值 (18)5.3 自定义Label (19)5.4 添加滑动门效果 (20)6参考资料 (21)百度地图API1基础知识1.1 百度地图 API 概念百度地图API是一套由JavaScript语言编写的应用程序接口,它能够帮助您在网站中构建功能丰富、交互性强的地图应用程序。
百度地图API不仅包含构建地图的基本功能接口,还提供了诸如本地搜索、路线规划等数据服务。
1.2 百度地图的“Hello, World”开始学习百度地图API最简单的方式是看一个简单的示例。
以下代码创建了一个520x340<meta http-equiv="Content-Type"content="text/html; charset=gbk"/> <title>Hello, World</title><scriptsrc=/api?key=46ce9d0614bf7aefe0ba562f8cf87194 &v=1.0&services=false type="text/javascript"></script></head><body><div style="width: 520px; height: 340px; border: 1px solid gray"id="container"></div></body></html><script type="text/javascript">var map = new BMap.Map("container"); // 创建Map实例var point = new BMap.Point(116.404, 39.915); // 创建点坐标map.centerAndZoom(point,15); // 初始化地图,设置中心点坐标和地图级别。
百度地图开发说明文档
百度地图说明文档1.界面展示界面整体分为4部分,主地图显示区、鼠标测距地图区、按钮与输入区、结果面板区。
主地图显示区用于除测距以外的功能显示,鼠标测距地图区只用于鼠标测距,结果面板区显示部分查询结果。
功能实现包括基本操作功能:鼠标滚轮放大、缩小、全图、拖拽平移、卫星地图切换、鼠标测距,其他功能有(1)定位查询(输入经纬度坐标在图上查询具体位置)(2)经纬度坐标获取(鼠标点击获取图上经纬度坐标)(3)快速查询(不同行政区级别点击查询缩放到当前位置,通过城市定位和关键字提示实现)(4)关键词查询(输入查询内容将查询结果显示到控制面板和图上)(5)覆盖物叠加(点击按钮将覆盖物添加到图上)(6)删除覆盖物(点击按钮删除覆盖物,包括关键字查询、路线查询在图上显示的覆盖物,用于清除查询结果,便于二次查询)(7)信息窗口(点击图上点覆盖物弹出信息窗口)(8)地址解析/逆解析、添加点线面(直接选用工具条上按钮进行绘制)(9)编辑功能(点击按钮开启/关闭编辑)(10)获取绘制的覆盖物个数,清除所有覆盖物(11)步行路线规划(包括地图上显示和结果面板显示)(12)驾车路线规划(信息窗口显示驾车所需时间和行驶距离,地图和结果面板显示路线)(13)公交车和地铁路线查询(输入公交车或地铁号,在结果面板显示经过的站点及发车信息)(14)公交车出行路线规划(地图上显示路线)(15)输入时关键字提示(16)右下角打开路况提示以下为部分功能实现效果截图关键字查询(结果显示在地图上)关键字查询结果显示在结果面板步行路线规划驾车路线规划公交车和地铁路线站点查询,结果显示在查询面板公交路线规划2.框架界面先分成左右两部分,container1、container2分别占70%和30%,左侧上部为主地图allmap占70%,下部按钮输入区container3占30%,右侧鼠标测距区allmap1占30%,结果面板r-result占70%。
百度地图API手册
核心类∙Map基础类∙Point∙Pixel∙Bounds∙Size控件类∙Control∙ControlAnchor∙NavigationControl∙NavigationControlType∙NavigationControlOptions∙OverviewMapControl∙OverviewMapControlOptions∙ScaleControl∙ScaleControlOptions∙LengthUnit∙CopyrightControl∙Copyright∙CopyrightControlOptions覆盖物类∙Overlay∙InfoWindow∙InfoWindowOptions∙Marker∙MarkerOptions∙Label∙LabelOptions∙Polyline∙PolylineOptions∙Polygon∙PolygonOptions∙Icon∙IconOptions右键菜单类∙ContextMenu∙MenuItem∙MenuItemOptions工具类∙PushpinTool∙PushpinToolOptions∙DistanceTool∙DragAndZoomTool∙DragAndZoomToolOptions∙ZoomType地图图层类∙TileLayer∙TileLayerOptions∙MapType服务类∙LocalSearch∙LocalSearchOptions∙StatusCode∙LocalResult∙LocalResultPoi∙PoiType∙TransitRoute∙TransitRouteOptions∙TransitPolicy∙TransitRouteResult∙TransitRoutePlan∙Line∙LineType∙DrivingRoute∙DrivingRouteOptions∙DrivingPolicy∙DrivingRouteResult∙RoutePlan∙Route∙RouteType∙WalkingRoute∙WalkingRouteOptions∙WalkingRouteResult∙Geocoder∙LocalCity∙LocalCityOptions∙LocalCityResult∙TrafficControlMap 类此类是地图API的核心类,用来实例化一个地图。
百度地图API基本使用(二)
百度地图API基本使⽤(⼆)本⽂系作者原创,转载请私信并在⽂章开头附带作者和原⽂地址链接。
违者,作者保留追究权利。
前⾔PS:我所使⽤的的是百度地图Javascript API 3.0本⽂是对之前使⽤的延续,继续对百度地图API的⼀些使⽤去做归纳和总结,本次主要是对地图上的覆盖物这块做介绍,如果有⼩伙伴没有看过之前的,可以先去观看⼀下,前期所需要的⼀些准备,以及⼀些基本的⽤法。
感兴趣的⼩伙伴可以⾃⾏查看百度地图官⽅提供的⽂档开发⽂档中的JavaScript API也可以通过下⽅⽰例中⼼更直观的看到百度地图API的⼀些使⽤,以及它的⼀些特性不过要注意:实例中⼼使⽤的是BMapGL去创建容器的,最新版GL地图命名空间为BMapGL, 可按住⿏标右键控制地图旋转、修改倾斜⾓度。
由于本次使⽤的是BMapGL所以在引⼊API的时候也不太⼀样引⼊⽅式如下:<script type="text/javascript" src="///api?type=webgl&v=1.0&ak=您的密钥"></script>好的,废话不多说,开整百度地图API-覆盖物在讲覆盖物之前,先给⼤家讲⼀下覆盖物的添加和删除的⽅法,这个是通⽤的,下⾯各种类型的覆盖的添加和删除的使⽤是⼀样的。
在我们获取到容器之后,根据⾃⼰的需求创建好⾃⼰的覆盖物对象之后,如果我们需要添加覆盖物的话,就可以使⽤容器对象.addOverlay(覆盖物对象);如果我们需要清除覆盖物的话,只需要使⽤容器对象.clearOverlays();就可以清除所有,但是如果只是想清除某⼀个覆盖物的话,我们需要使⽤容器对象.removeOverlays(覆盖物对象);代码⽰例如下://创建容器var map = new BMapGL.Map('allmap');var point = new BMapGL.Point(116.404, 39.915);map.centerAndZoom(point, 15);// 创建点覆盖物var marker = new BMapGL.Marker(new BMapGL.Point(116.404, 39.915));//添加覆盖物map.addOverlay(marker);//删除具体覆盖物map.removeOverlays(marker);//删除所有覆盖物map.clearOverlays();1. 点覆盖物点覆盖物主要使⽤的是Marker这个⽅法,例如:var marker1 = new BMapGL.Marker(new BMapGL.Point(经度, 纬度));这样就创建好了⼀个点覆盖物对象,我们需要使⽤上⾯介绍的添加覆盖物的⽅法,将覆盖物添加到容器中,即容器对象.addOverlay(marker1)这样就实现了简单的点覆盖物,不过有的时候需要我们的覆盖物能够拖动,所以这个时候就要⽤到⼀个属性enableDragging,默认情况下是false,也就是说在上⾯的那些默认创建的⽅式这个属性都是false,这是属性字⾯意思也很好理解⽀持拖拽,所以如果有需要拖拽的需求,我们只需要将整个属性设置为true。
如何在网中使用百度地图API自定义个性化地图
如何在⽹中使⽤百度地图API⾃定义个性化地图<!DOCTYPE html><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="keywords" content="百度地图,百度地图API,百度地图⾃定义⼯具,百度地图所见即所得⼯具" /><meta name="description" content="百度地图API⾃定义地图,帮助⽤户在可视化操作下⽣成百度地图" /><title>百度地图API⾃定义地图</title><!--引⽤百度地图API--><script type="text/javascript" src="/api?v=2.0&ak=17b7Lhnf06x0CMZLI3aYn5ZIdMxfGcyc"></script> </head><body><!--百度地图容器--><div style="width:100%;height:550px;border:#ccc solid 1px;font-size:12px" id="map"></div></body><script type="text/javascript">//创建和初始化地图函数:function initMap(){createMap();//创建地图setMapEvent();//设置地图事件addMapControl();//向地图添加控件addMapOverlay();//向地图添加覆盖物}function createMap(){map = new BMap.Map("map");map.centerAndZoom(new BMap.Point(116.421218,40.068393),15);}function setMapEvent(){map.enableScrollWheelZoom();map.enableKeyboard();map.enableDragging();map.enableDoubleClickZoom()}function addClickHandler(target,window){target.addEventListener("click",function(){target.openInfoWindow(window);});}function addMapOverlay(){var markers = [{content:"哈哈哈",title:"禹⾠时代",imageOffset: {width:0,height:3},position:{lat:40.072424,lng:116.420931}}];for(var index = 0; index < markers.length; index++ ){var point = new BMap.Point(markers[index].position.lng,markers[index]t);var marker = new BMap.Marker(point,{icon:new BMap.Icon("/lbsapi/createmap/images/icon.png",new BMap.Size(20,25),{imageOffset: new BMap.Size(markers[index].imageOffset.width,markers[index].imageOffset.height)})});var label = new bel(markers[index].title,{offset: new BMap.Size(25,5)});var opts = {width: 200,title: markers[index].title,enableMessage: false};var mapStyle = { style: "dark" };map.setMapStyle(mapStyle);var infoWindow = new Window(markers[index].content,opts);marker.setLabel(label);addClickHandler(marker,infoWindow);map.addOverlay(marker);};}//向地图添加控件function addMapControl(){var scaleControl = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});scaleControl.setUnit(BMAP_UNIT_IMPERIAL);map.addControl(scaleControl);var navControl = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE}); map.addControl(navControl);var overviewControl = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:true});map.addControl(overviewControl);}var map;initMap();</script></html>重点:创建应⽤的时候:选项如下图所⽰。
百度地图Baidu Map API中文开发文档
控件 _______________________________________________________________7
地图控件概述 ___________________________________________________________ 7 向地图添加控件 _________________________________________________________ 7 控制控件位置 ___________________________________________________________ 8 修改控件配置 ___________________________________________________________ 8 自定义控件 _____________________________________________________________ 8
定义标注图标 _________________________________________________________________ 10 监听标注事件 _________________________________________________________________ 11 可托拽的标注 _________________________________________________________________ 11 内存释放 _____________________________________________________________________ 12
百度地图WebAPI使用指南
百度地图WebAPI使用指南一、WebAPI介绍百度地图WebAPI是百度提供的一套基于Web的地图应用程序接口,旨在帮助开发者快速构建地图相关应用。
它提供了多种功能,如地图显示、地图搜索、路线规划等,使开发者可以将地图相关功能集成到自己的网站或应用中。
二、地图显示1.地图展示模块百度地图WebAPI提供了地图展示模块,可以在网页中显示地图。
开发者可以通过指定地图的中心点和缩放级别来展示不同区域的地图;还可以添加自定义的覆盖物,如标注、信息窗口等,为地图增加更多的功能和交互体验。
2.地图样式设置百度地图WebAPI支持自定义地图样式,开发者可以根据自己的需求,调整地图的颜色、图标、文字等,打造独特的地图风格。
三、地图搜索1.地点搜索百度地图WebAPI提供了地点搜索功能,开发者可以根据关键词搜索附近的地点信息。
搜索结果包括地点名称、地址、联系方式等详细信息,还可以获取地点的坐标信息,方便进行其他操作。
2.地点详情除了地点搜索,百度地图WebAPI还支持查询具体地点的详细信息,如所属区域、营业时间、评分等。
开发者可以通过API获取这些信息,并在自己的应用中展示。
四、路线规划1.驾车路线规划百度地图WebAPI支持驾车路线规划,开发者可以根据起点和终点计算最优驾车路线,并获取详细的导航信息,如总距离、预计行驶时间、途经路线等。
2.步行和骑行路线规划除了驾车路线规划,百度地图WebAPI还支持步行和骑行路线规划。
开发者可以根据起点和终点,计算出最短的步行或骑行路线,并获取相关的信息。
五、定位与地理编码1.定位功能百度地图WebAPI提供了定位功能,可以通过浏览器获取用户的当前位置。
开发者可以利用这个功能实现位置服务、导航等应用。
2.逆地理编码百度地图WebAPI支持逆地理编码功能,将坐标转换为实际地址。
开发者可以根据坐标信息,获取位置的详细地址,方便展示和使用。
六、云存储与数据可视化1.云存储百度地图WebAPI提供了云存储功能,开发者可以将自定义的数据存储在百度地图云平台上。
百度地图API使用(JS案例Web服务器案例)
百度地图API使⽤(JS案例Web服务器案例)前⾔这⼏天在项⽬中⽤到了百度地图这个插件,所以准备花点时间记录⼀下⼼得,好东西就要分享出来!1. 百度地图使⽤⽅式1.11.2 申请AK我的需求时web端,所有这⾥选择了浏览器端。
⽩名单上线前使⽤*号,线上正式ak请设置合理的IP⽩名单2.主要学习: 定位技术、路径规划和导航2.1 打开2.2 点击开发指南中的2.3⾄此,我们就快速创建了⼀张以天安门为中⼼的地图~注意: ak=必须时⾃⼰申请的3. 常见相关API 可以在这⾥查找这⾥只介绍⼀些常⽤的3.11<!DOCTYPE html>2<html>3<head>4<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />5<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />6<title>Hello, World</title>7<style type="text/css">8html{9height:100%10}11body{12height:100%;13margin:0px;14padding:0px 15}16#container{17height:100%18}19</style>20<script type="text/javascript" src="https:///api?v=3.0&ak=iG0Qt0gY2IMtf99aZe0j7d1cNnXxIhwM"></script>21</head>2223<body>24<div id="container"></div>25<script type="text/javascript">26// 创建地图实例27var map = new BMap.Map("container");28// 创建点坐标29var point = new BMap.Point(116.404, 39.915);30// 初始化地图,设置中⼼点坐标和地图级别31map.centerAndZoom(point, 15);32</script>33</body>34</html>3.2可以给地图中的点添加标注,添加标注的时候要⼀个point(坐标)对象,把标注添加到坐标位置。
百度地图api 移动标注
<!doctype html><html><head><meta http-equiv=content-type content=text/html; charset=utf-8 /><title>百度地图</title><script type=text/javascript>var iscreatr=false;function initialize() {var x = 116.4035;//设置默认标注点xvar y = 39.915;//设置默认标注点y//---------------------------------------------基础示例---------------------------------------------var map = new bmap.map(allmap,{minzoom:12,maxzoom:20});// 创建map实例,将地图挂到那个容器,用id表示map.centerandzoom(new bmap.point(x,y),15); //初始化时,即可设置中心点和地图缩放级别。
//map.centerandzoom(成都,13); // 初始化地图,设置中心点坐标和地图级别。
map.enablescrollwheelzoom(true);//鼠标滑动轮子可以滚动var point = new bmap.point(x,y);//默认// 创建标注对象并添加到地图var marker = new bmap.marker(point);var label = new bel(默认提示,{offset:new bmap.size(20,-10)});marker.setlabel(label)map.addoverlay(marker);marker.enabledragging(); //可拖拽marker.addeventlistener(dragend, function(e){//将结果进行拼接并显示到对应的容器内document.getelementbyid(r-result).innerhtml = e.point.lng + , + t;//打印拖动结束坐标});}function loadscript() {var script = document.createelement(script);script.src = /api?v=1.4&callback=initialize;document.body.appendchild(script);}window.onload = loadscript;</script></head><body><div id=r-result style=float:left;width:100px;>坐标</div><div id=allmap style=width: 800px; height: 500px></div></body></html>。
百度地图API类参考
APIAPIa)MapAPIMap(container:String|HTMLElement[,opts:MapOptions])Map.centerAndZoom()方法对地图进行初始化。
未进行初enableDragging()disableDragging()enableScrollWheelZoom()EnddisableKeyboard( )enableInertialDr agging()disableInertialD ragging()enableContinuous none(自1.1(自1.1 nonenonenonedisableScrollWhe elZoom()enableDoubleClic kZoom()disableDoubleCli ckZoom()none none none none none noneenableKeyboard()nonePgUp、PgDn、HomeAPI Zoom()disableContinuou sZoom()enablePinchToZoo m()disablePinchToZo om()none(自1.1(自1.1(自1.1(自1.1 nonenonegetBounds()Bou ndsPoi ntNum berMapgetMapType()TypesgetSize()Siz egetCenter()getDistance(start:Point,end:Point)(自1.1(自1.1getViewport(view:Array<Point>[, viewportOptions: ViewportOptions])Viewportcenter zoom(自1.1getZoom()Num berStr ingtoString()centerAndZoom(center:Point, zoom:Number)nonexyBMAP_PERSPECTIVE_MAP centerAndZoomnonenonezoomIn()var map=new BMap.Map(“container”, {mapType:BMAP_PERSPECTIVE_MAP});map.setCurrentCity(“北京市”);map.centerAndZoom(new BMap.Point(116.404,39.915),18);BMAP_NORMAL_MAP,则在调setMapType(自1.1panTo(center:Point)no nepanBy(x:Number,y:Number)no neno neno nereset()setCenter(center:Point)setCurrentCity(city:String)no nesetMapType(mapType:MapTypes) setViewport(view:Array<Point>|Viewport[, ViewportOptions])viewportOptions:nonenone(自1.1(自1.1zoomTo(zoom:Number)zoomOut()no neaddControl(control :Control)removeControl(cont rol:Control)noneControl.initialize()方法,并将控件的容器元素添加到nonegetContainer()HTMLEl ementaddContextMenu(menu:ContextMenu)removeContextMenu(menu:ContextMenu)none noneaddOverlay(overlay:Overl ay)removeOverlay(overlay:Ov erlay)clearOverlays()openInfoWindow(infoWnd:I nfoWindow,point:Point)closeInfoWindow()nonePixel(自1.1PointInfoWin dow|Nul(自1.1null 。
百度地图api(html)
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>地址解析和智能搜索</title><script type="text/javascript" src="/api?v=1.2"></script></head><body><h2>1、地址解析Geocoder</h2><input style="width:300px;" type="text" value="上海市浦东新区花木路" id="address_1" /><input value="地址解析" type="button" onclick="fun_geocoder_getPoint();" />(getPoint:需要输入详细到街道的地址)</br><span style="display:inline-block;line-height:20px;width:300px;font-size:14px;border-bottom:1px solid #ccc;" type="text" id="address_2"></span><input value="反地址解析" type="button" onclick="fun_geocoder_getLocation();" />(getLocation:点击反地址解析后,点击地图返回地址。
百度地图map常用的api
百度地图map常⽤的api <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>v3.0版本 map核⼼类⾃定义控件地图样式(setMapStyle) 获取全景⽰例(getPanorama())</title><style>html{height:100%}body{height:100%;margin:0px;padding:0px}#container{height:80%}</style><script type="text/javascript" src="/api?v=3.0&ak=你的秘钥"></script></head><body><div id="container"></div><div><button id="bound">返回地图可视区域</button><button id="center">中⼼点</button><button id="nanhua">南华⼤学</button><div id="adds"><button name="btns" id="add">+</button><span>视图等级</span><button name="btns" id="del">-</button></div></div><script>window.onload = function(){// 创建地图实例var map = new BMap.Map("container");// 创建点坐标var point = new BMap.Point(112.5527201488,26.9273408603); //衡阳县第六中学// 设初始化地图// 若调⽤⾼清底图(针对移动端开发)时,zoom可赋值范围为3-18级// 如果center类型为字符串时,⽐如“北京”,zoom可以忽略,地图将⾃动根据center适配最佳zoom级别map.centerAndZoom(point, 15);// 初始化地图,设置中⼼点坐标和地图级别 3-19//设置地图类型//BMAP_NORMAL_MAP 此地图类型展⽰普通街道视图//BMAP_SATELLITE_MAP 此地图类型展⽰卫星视图//BMAP_HYBRID_MAP 此地图类型展⽰卫星和路⽹的混合视图//map.setMapType(); //格式不清楚??map.addControl(new BMap.MapTypeControl({ mapTypes: [BMAP_SATELLITE_MAP] }));// 地图类型//map.addControl(new BMap.MapTypeControl());// 地图类型map.enableScrollWheelZoom(true); //开启⿏标滚轮缩放map.enableDragging(); //启⽤地图拖拽,默认启⽤//map.disableDragging(); //禁⽤地图拖拽map.enableScrollWheelZoom(); //启⽤滚轮放⼤缩⼩,默认禁⽤//map.disableScrollWheelZoom(); //禁⽤滚轮放⼤缩⼩map.enableDoubleClickZoom(); //启⽤双击放⼤,默认启⽤//map.disableDoubleClickZoom(); //禁⽤双击放⼤map.enableKeyboard(); //启⽤键盘操作,默认禁⽤。
百度地图API地理位置和坐标转换
百度地图API地理位置和坐标转换
1.由地名(省份、城市、街道等)得到其对应的百度地图坐标:
/geocoder/v2/?output=json&ak=你从百度申请到的Key&address=北京市
其对⼤陆主要城市的解析很好,但是有些⼤陆的⼩城市、⾹港、台湾的⼀些区域⽆法解析,我测试到的如下:
解析错误的城市:伊犁|新界|新⽵|港岛|基隆|云林|博尔塔拉|桃园|苗栗|南投|克孜勒苏|台东|
伊犁可以使⽤新疆伊犁来解析,更好的办法是使⽤⾕歌地图API,⽐如这样使⽤:
/maps/api/geocode/json?sensor=false&address=地址
在⾕歌地图中,港岛可以使⽤:
Hong Kong Island
来解析,
云林可以使⽤:
Yunlin County, Taiwan
来解析,
博尔塔拉可以使⽤博尔塔拉蒙古⾃治州来解析,
2.由坐标反解得到对应的地址:
/geocoder/v2/?output=json&ak=你从百度申请到的Key&location=纬度(Latitude),经度(Longitude)
注意,纬度和经度之间有个英⽂逗号。
具体参考:。
百度地图API自己的地图自己绘制
HTML或者JSP 再或者PHP文件<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="viewport" content="initial-scale=1.0, user-scalable=no" /><style type="text/css">body, html{width: 100%;height: 100%;overflow: hidden;margin:0;}#allmap {height: 100%;overflow: hidden;}#result {border-left:1px dotted #999;height:100%;width:295px;position:absolute;top:0px;right:0px;font-size:12px; border:1px double red; display:none;}dl,dt,dd,ul,li{margin:0;padding:0;list-style:none;}p{font-size:12px;}dt{font-size:14px;font-family:"微软雅黑";font-weight:bold;border-bottom:1px dotted #000;padding:5px 0 5px 5px;margin:5px 0;}dd{padding:5px 0 0 5px;}li{line-height:28px;}#toolBar{position:relative;width:100%;height:5%;border:1px double red;}</style><script type="text/javascript" src="/api?v=1.4"></script><!--加载鼠标绘制工具--><script type="text/javascript" src="DrawingManager_min.js" charset="utf-8"></script><link rel="stylesheet" href="DrawingManager_min.css" /><!--加载检索信息窗口--><script type="text/javascript" src="SearchInfoWindow_min.js" charset="utf-8"></script><link rel="stylesheet" href="SearchInfoWindow_min.css" /><!--根据新浪得到地址。
百度地图API
Map 类此类是地图API的核心类,用来实例化一个地图。
构造函数配置方法地图状态方法修改地图状态方法控件方法右键菜单方法覆盖物方法地图图层方法坐标变换事件MapOptions 类此类表示Map构造函数的可选参数。
它没有构造函数,但可通过对象字面量形式表示。
Point 类此类表示一个地理坐标点。
属性方法Pixel 类此类表示地图上的一点,单位为像素。
属性方法Bounds 类构造函数此类表示地理坐标的矩形区域。
矩形区域通过两个点的x、y坐标进行描述,其中数值较小的点位于矩形的左下角、数值较大的点位于矩形的右上角。
属性方法Size 类此类以像素表示一个矩形区域的大小。
Size对象包含两个属性:width、height,分别表示矩形的水平方向的数值和竖直方向的数值。
属性方法Control 类此类是所有控件的基类,您可以通过此类来实现自定义控件。
所有控件均包含Control类的属性、方法和事件。
通过Map.addControl()方法可将控件添加到地图上。
属性方法ControlAnchor 枚举常量此常量表示控件的定位。
NavigationControl 类此类表示地图的平移缩放控件,可以对地图进行上下左右四个方向的平移和缩放操作。
构造函数方法NavigationControlType 枚举常量此常数表示平移缩放控件的类型常数NavigationControlOptions 类此类表示NavigationControl构造函数的可选参数。
它没有构造函数,但可通过对象字面量形式表示。
属性OverviewMapControl 类此类表示缩略地图控件。
构造函数方法事件OverviewMapControlOptions 类此类表示OverviewMapControl构造函数的可选参数。
它没有构造函数,但可通过对象字面量形式表示。
属性ScaleControl 类此类表示比例尺控件。
构造函数方法LengthUnit 枚举常量此常数表示长度单位制。
百度API
开始学习百度地图API最简单的方式是看一个简单的示例。
以下代码创建了一个520x3 40大小的地图区域并以天安门作为地图的中心:1. <html>2. <head>3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />4. <title>Hello, World</title>5. <script type="text/javascript" src="/api?key=46ce9 d0614bf7aefe0ba562f8cf87194&v=1.0&services=false"></script>6. </head>7. <body>8. <div style="width:520px;height:340px;border:1px solid gray" id="container "></div>9. </body>10. </html>11.12.<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Hello, World</title><script type="text/javascript" src="/api?key=46ce9d0 614bf7aefe0ba562f8cf87194&v=1.0&services=false"></script></head><body><div style="width:520px;height:340px;border:1px solid gray" id="container">< /div></body></html>1. <script type="text/javascript">2. var map = new BMap.Map("container"); // 创建地图实例3. var point = new BMap.Point(116.404, 39.915); // 创建点坐标4. map.centerAndZoom(point, 15); // 初始化地图,设置中心点坐标和地图级别5. </script>6.<script type="text/javascript">var map = new BMap.Map("container"); // 创建地图实例var point = new BMap.Point(116.404, 39.915); // 创建点坐标map.centerAndZoom(point, 15); // 初始化地图,设置中心点坐标和地图级别</script>引用百度地图API文件当您引用地图API文件时,需要使用自己申请的API密钥。
百度api的使用
idu.mapapi.MapView
android:id="@+id/bmapsView" android:layout_width="fill_parent" android:layout_height="fill_parent" android:clickable="true"
MapController
• • 处理地图移动和缩放的工具类。 方法: setCenter(GeoPoint point) : 在给定的中心点GeoPoint上设置地图视图。 setZoom(int zoomLevel) : 设置地图的缩放级别。
GeoPoint
• • 表示一个地理坐标点,存放经度和纬度,以微度的整数形式存储 构造方法: GeoPoint(int latitudeE6, int longitudeE6) 用给定的经纬度构造一个GeoPoint
/>
MapActivity类
• 管理显示在MapView类中activity处理逻辑的基础类 。MapActivity是 一个基类,它使用代码去管理任何一个Activity繁琐的事务,它的责 任包括: Activity生命周期管理 、在一个MapView后面创建和销毁服 务 、一个子类应当在onCreate(Bundle)创建它自己的MapView。 重要方法: public boolean initMapActivity(BMapManager bmapMan) 用于初使 化activity。
•
MapView
• • 一个显示地图的视图,当被焦点选中时,它能捕获按键事件和 触摸手势去平移和缩放地图 重要方法: setBuiltInZoomControls(boolean on):设置是否启用内置的缩 放控件。 getController():返回地图的MapController,这个对象可用于控 制和驱动平移和缩放。 setDoubleClickZooming(boolean bDoubleClickZooming) : 设置 mapview是否支持双击放大效果 。
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
核心类
•Map
基础类
•Point
•Pixel
•Bounds
•Size
控件类
•Control •ControlAnchor •NavigationControl •NavigationControlType •NavigationControlOptions •OverviewMapControl •OverviewMapControlOptions •ScaleControl •ScaleControlOptions •LengthUnit •CopyrightControl •Copyright •CopyrightControlOptions 覆盖物类
•Overlay
•InfoWindow •InfoWindowOptions •Marker •MarkerOptions
•Label
•LabelOptions
•Polyline •PolylineOptions •Polygon •PolygonOptions
•Icon
•IconOptions
右键菜单类•ContextMenu •MenuItem •MenuItemOptions
工具类
•PushpinTool •PushpinToolOptions •DistanceTool
•DragAndZoomTool
•DragAndZoomToolOptions
•ZoomType
地图图层类
•TileLayer
•TileLayerOptions
•MapType
服务类
•LocalSearch
•LocalSearchOptions
•StatusCode
•LocalResult
•LocalResultPoi
•PoiType
•TransitRoute
•TransitRouteOptions
•TransitPolicy
•TransitRouteResult
•TransitRoutePlan
•Line
•LineType
•DrivingRoute
•DrivingRouteOptions
•DrivingPolicy
•DrivingRouteResult
•RoutePlan
•Route
•RouteType
•WalkingRoute
•WalkingRouteOptions
•WalkingRouteResult
•Geocoder
•LocalCity
•LocalCityOptions
•LocalCityResult
•TrafficControl
Map 类
此类是地图API的核心类,用来实例化一个地图。
构造函数
此类表示Map构造函数的可选参数。
它没有构造函数,但可通过对象字面量形式表示。
此类表示一个地理坐标点。
此类表示地图上的一点,单位为像素。
Bounds 类
构造函数
此类表示地理坐标的矩形区域。
矩形区域通过两个点的x、y坐标进行描述,其中数值较小的点位于矩形的左下角、数值较大的点位于矩形的右上角。
此类以像素表示一个矩形区域的大小。
Size对象包含两个属性:width、height,分别表
此类是所有控件的基类,您可以通过此类来实现自定义控件。
所有控件均包含Control类的属性、方法和事件。
通过Map.addControl()方法可将控件添加到地图上。
此常量表示控件的定位。
此类表示NavigationControl构造函数的可选参数。
它没有构造函数,但可通过对象字面
此类表示缩略地图控件。
构造函数
此类表示OverviewMapControl构造函数的可选参数。
它没有构造函数,但可通过对象字
此类表示ScaleControl构造函数的可选参数。
它没有构造函数,但可通过对象字面量形
此类表示版权控件,您可以在地图上添加自己的版权信息。
每一个版权信息需要包含如下内
此类表示一条版权信息。
可作为CopyrightControl.addCopyright()方法的参数。
它没
此类表示CopyrightControl构造函数的可选参数。
它没有构造函数,但可通过对象字面
此类表示InfoWindow构造函数的可选参数,它没有构造函数,但可通过对象字面量形式表示。
此类表示Marker构造函数的可选参数。
它没有构造函数,但可通过对象字面量形式表示。
此类表示地图上的文本标注。
此类表示Lable构造函数的可选参数。
它没有构造函数,但可通过对象字面量形式表示。
此类表示Polyline构造函数的可选参数。
它没有构造函数,但可通过对象字面量形式表示。
此类表示Polygon构造函数的可选参数。
它没有构造函数,但可通过对象字面量形式表示。
此类表示标注覆盖物所使用的图标。
此类表示Icon构造函数的可选参数。
它没有构造函数,但可通过对象字面量形式表示。
此类表示标注工具。
此工具用来让使用者在地图上标注一个位置,可以通过该工具提供的事
此类表示PushpinTool构造函数的可选参数。
它没有构造函数,但可通过对象字面量形式
此类表示DragAndZoomTool构造函数的可选参数。
它没有构造函数,但可通过对象字面量
此枚举常量表示区域缩放工具的缩放类型
此类表示一个菜单项。
此枚举常量表示地图图层的类型
此类表示搜索结果呈现的配置。
它没有构造函数,但可通过对象字面量形式表示。
此常量用于描述对象当前状态。
此类表示LocalSearch的检索结果,没有构造函数,通过LocalSearch.getResults()方法或LocalSearch的onSearchComplete回调函数的参数得到。
此枚举常量表示地点的类型。
此类表示TransitRoute构造函数的可选参数。
它没有构造函数,但可通过对象字面量形式表示。
此常量表示公交方案的策略。
此类表示路线导航的结果,没有构造函数,通过访问TransitRoute.getResults()方法或
此类表示一条公交出行方案。
没有构造函数,通过TransitRouteResult.getPlan()方法
此枚举类型表示不同类型的公共交通线路。
此枚举类型表示驾车方案的策略配置。
此类表示路线导航的结果,没有构造函数,通过DrivingRoute.getResults()方法或
此类表示一条驾车或步行出行方案。
它没有构造函数,可通过
DrivingRouteResult.getPlan()方法或WalkingRouteResult类的getPlan()方法获
此常量表示不同的线路类型。
此类表示驾车或步行路线中的一个关键点。
它没有构造函数,通过Route.getStep()方法
此类表示WalkingRoute构造函数的可选参数。
此类表示路线导航的结果,没有构造函数,通过访问WalkingRoute.getResults()方法或
此类表示交通流量控件,它继承Control类,包含该类的所有方法。
该控件的停靠位置常。