本篇文章介绍com.justep.cordova.plugin.baiduMapBase/com.justep.cordova.plugin.baiduMapSearch插件,以及如何使用它们,来开发一个原生的内嵌百度地图。
插件概述
com.justep.cordova.plugin.baiduMapBase/com.justep.cordova.plugin.baiduMapSearch(以下简称为baiduMapBase/baiduMapSearch)这两个插件分别封装了百度地图SDK的不同模块。其中,baiduMapBase中封装了基础地图的使用,包括定位,图层展示,坐标计算,离线地图等;baiduMapSearch插件则封装了地图的查询模块,主要能力是路线查询,兴趣点查询相关能力,并且,BaiduMapSearch插件依赖于baiduMapBase插件。通过这两个插件,我们可以开发出内嵌于应用的原生的百度地图,相比于js版地图而言,地图更加流畅,会带来更好的用户体验。
插件参数
在使用此插件之前,我们必须申请与之相对应的参数,前往百度地图开放平台,然后将申请好的参数填入打包选项中即可。
请确认参数的准确性,一旦参数错误,会打开一个空白的地图!如下:
API目录
基础地图API
open close
removeEventListener setPosition
getCurrentLocation getLocationFromName
getNameFromLocation showCurrentLocation
setCenter getCenter
setZoomLevel setMapAttr
setRotation setOverlook
setScaleBar setCompass
setTraffic setHeatMap
setBuilding setRegion
getRegion zoomIn
zoomOut addAnnotations
removeAnnotations removeAllAnno
getAnnotationCoords updateAnnotationCoords
annotationExist addLine
addPolygon addArc
addCircle removeOverlay
getDistance transCoords
offLineMapInit addOfflineListener
removeOfflineListener getHotCityList
getOfflineCityList searchCityByName
getUpdateInfo getAllUpdateInfo
downLoad update
pause remove
搜索相关api
searchRoute drawRoute
removeRoute searchBusRoute
drawBusRoute searchInCity
searchNearby
navigator.baiduMap.base.open(args,success,error)
描述:打开百度地图
args: Object – 传入参数,示例如下:
{
position:Object – 地图的位置及尺寸,例如:{x:0, y:0, w:320, h:480},缺省全屏显示,
center:Object – 地图的中心位置,例如:{lon:116.397, lat:39.910},缺省北京天安门,
zoomLevel:Number – 缩放等级,取值范围3-21,缺省10 ,
events:Object – 可选参数,要监听的事件以及回调,可选值如下:{click:func, dbClick:func, longPress:func, viewChange:func},分别为单击事件、双击事件、长按事件、地图视图发生变化事件,
model:Object – 可选参数,当前model。如果传入model,则会在model onInActive时判地图是否已经被销毁,如果没有则会自动调用close销毁地图
}
success:Function – 地图成功打开的回调(当地图完全渲染成功后才会调用此回调)
error:Function – 地图打开出错的回调
navigator.baiduMap.base.close()
描述:关闭百度地图
navigator.baiduMap.base.removeEventListener(action)
描述:停止监听地图某一事件
action: String – 要移除监听事件的名称,比如:‘click’
navigator.baiduMap.base.setPosition(args)
描述:调整地图的显示区域及显示大小
args: Object – 传入参数,示例如下:
{
x:Number – 地图左上角的 x 坐标,
y:Number – 地图左上角的 y 坐标,
w:Number – 地图的宽度,
h:Number – 地图的高度,
}
navigator.baiduMap.base.getCurrentLocation(success,error)
描述:获取当前位置的经纬度
success:Function – 成功回调,返回经纬度与时间戳,返回示例:
{
lon: Number – 经度,
lat:xx : Number – 纬度,
timestamp:String – 时间戳
}
error:Function – error 失败回调
navigator.baiduMap.base.getLocationFromName(args,success,error)
描述:根据地址信息获取经纬度
args: Object – 传入参数,示例如下:
{
city:String – 地址所在城市,
address:String – 地址信息
}
success:Function – 成功返回示例:
{lat:39.9151754663074,lon:116.4039058301959}
error:Function – 失败回调
navigator.baiduMap.base.getNameFromLocation(args,success,error)
描述:根据经纬度查找地址信息
args: Object – 传入参数,示例如下:
{
“lon”:Number – 经度,
“lat”:Number – 纬度,
}
评一波