地图

createMapContext

createMapContext(string mapId)

创建 map 上下文 MapContext 对象。

参数

参数 string mapId map 组件的 id

返回值

MapContext

MapContext

MapContext.addArc

添加弧线，途经点与夹角必须设置一个

参数

Object object

属性	类型	默认值	必填	说明
id	number		是	圆弧 id
start	Object		是	起始点
end	Object		是	终点
pass	Object		否	途经点
angle	number	0	否	夹角角度
width	number	5	否	线宽
color	number	#000000	否	线的颜色
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

object.start 的结构属性

属性	类型	默认值	必填	说明
longitude	number		是	经度
latitude	numbe		是	纬度

object.end 的结构属性

属性	类型	默认值	必填	说明
longitude	number		是	经度
latitude	numbe		是	纬度

object.pass 的结构属性

属性	类型	默认值	必填	说明
longitude	number		是	经度
latitude	numbe		是	纬度

MapContext.addCustomLayer

添加个性化图层

参数

Object object

属性	类型	默认值	必填	说明
layerId	string		是	个性化图层id
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.addGroundOverlay

创建自定义图片图层，图片会随着地图缩放而缩放

参数

Object object

属性	类型	默认值	必填	说明
id	String		是	图片图层 id
src	String		是	图片路径，支持网络图片、临时路径、代码包路径
bounds	Object		是	图片覆盖的经纬度范围
visible	Boolean	true	否	是否可见
zIndex	Number	1	否	图层绘制顺序
opacity	Number	1	否	图层透明度
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

object.bounds 的结构属性

属性	类型	默认值	必填	说明
southwest	Object		是	西南角经纬度
northeast	Object		是	东北角经纬度

bounds.southwest 的结构属性

结构属性	类型	默认值	必填	说明
longitude	number		是	经度
latitude	number		是	纬度

bounds.northeast 的结构属性

结构属性	类型	默认值	必填	说明
longitude	number		是	经度
latitude	number		是	纬度

MapContext.addMarkers

添加 marker。

支持度:
系统地图(仅iOS支持)
✅

高德地图
iOS:✅ Android:✅ IDE:✅

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

属性	类型	默认值	必填	备注	其他
markers	Array		是	同传入 map 组件的 marker 属性
clear	boolean	false	否	是否先清空地图上所有 marker	iOS不支持
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.addVisualLayer

不支持

MapContext.fromScreenLocation

返回地图左上角经纬度。

支持度:
系统地图(仅iOS支持)
✅

高德地图
iOS:✅ Android:✅ IDE:✅

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

属性	类型	默认值	必填	备注	其他
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.getCenterLocation

获取当前地图中心的经纬度。

支持度:
系统地图(仅iOS支持)
✅

高德地图
iOS:✅ Android:✅ IDE:✅

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

属性	类型	默认值	必填	备注	其他
iconPath	string		否	图标路径，支持网络路径、本地路径、代码包路径	iOS不支持
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.getRegion

获取当前地图的视野范围。

支持度:
系统地图(仅iOS支持)
✅

高德地图
iOS:✅ Android:✅ IDE:✅

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

属性	类型	默认值	必填	备注	其他
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.getRotate

获取当前地图的旋转角。

支持度:
系统地图(仅iOS支持)
❌

高德地图
iOS:✅ Android:✅ IDE:✅

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

属性	类型	默认值	必填	备注	其他
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.getScale

获取当前地图的缩放级别。

支持度:
系统地图(仅iOS支持)
✅

高德地图
iOS:✅ Android:✅ IDE:✅

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

属性	类型	默认值	必填	备注	其他
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.getSkew

获取当前地图的倾斜角。

支持度:
系统地图(仅iOS支持)
❌

高德地图
iOS:✅ Android:✅ IDE:✅

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

属性	类型	默认值	必填	备注	其他
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.includePoints

缩放视野展示所有经纬度。

支持度:
系统地图(仅iOS支持)
✅

高德地图
iOS:✅ Android:✅ IDE:❌

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

属性	类型	默认值	必填	备注	其他
points	Array.Object>		是	要显示在可视区域内的坐标点列表
padding	Array.number>		否	坐标点形成的矩形边缘到地图边缘的距离，单位像素。格式为[上,右,下,左]。	Android谷歌地图上只能识别数组第一项，上下左右的padding一致 IDE不支持
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.initMarkerCluster

初始化点聚合的配置，未调用时采用默认配置。

支持度:
系统地图(仅iOS支持)
❌

高德地图
iOS:❌ Android:✅ 不支持enableDefaultStyle IDE:❌

百度地图(仅iOS、Android支持)
iOS:❌ Android:✅ 不支持enableDefaultStyle

腾讯地图(仅iOS、Android支持)
iOS:❌ Android:✅ 不支持enableDefaultStyle

谷歌地图(仅Android支持)
✅ 不支持enableDefaultStyle

参数

属性	类型	默认值	必填	备注	其他
enableDefaultStyle	boolean	true	否	启用默认的聚合样式
zoomOnClick	boolean	true	否	点击已经聚合的标记点时是否实现聚合分离
gridSize	number	60	否	聚合算法的可聚合距离，即距离小于该值的点会聚合至一起，以像素为单位
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.moveAlong

沿指定路径移动 marker，用于轨迹回放等场景。动画完成时触发回调事件，若动画进行中，对同一 marker 再次调用 moveAlong 方法，前一次的动画将被打断。

支持度:
系统地图(仅iOS支持)
✅

高德地图
iOS:✅ Android:✅ IDE:✅

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

属性	类型	默认值	必填	备注	其他
markerId	number		是	指定 marker
path	Array		是	移动路径的坐标串，坐标点格式 {longitude, latitude}
autoRotate	boolean	true	否	根据路径方向自动改变 marker 的旋转角度	iOS不支持 IDE不支持，默认不改变marker旋转角度
duration	number		是	平滑移动的时间
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.moveToLocation

将地图中心移置当前定位点。

支持度:
系统地图(仅iOS支持)
✅

高德地图
iOS:✅ Android:✅ IDE:✅

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

属性	类型	默认值	必填	备注	其他
longitude	number		否	经度
latitude	number		否	纬度
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.on

监听地图事件:'markerClusterCreate'缩放或拖动导致新的聚合簇产生时触发，仅返回新创建的聚合簇信息； 'markerClusterClick'聚合簇的点击事件。

支持度:
系统地图(仅iOS支持)
❌

高德地图
iOS:❌ Android:✅ 不支持markerClusterCreate IDE:❌

百度地图(仅iOS、Android支持)
iOS:❌ Android:✅ 不支持markerClusterCreate

腾讯地图(仅iOS、Android支持)
iOS:❌ Android:✅ 不支持markerClusterCreate

谷歌地图(仅Android支持)
✅ 不支持markerClusterCreate

示例代码

  MapContext.on('markerClusterCreate', (res) => {})
  MapContext.on('markerClusterClick', (res) => {})

MapContext.openMapApp

拉起地图APP选择导航。

支持度:
系统地图(仅iOS支持)
✅

高德地图
iOS:✅ Android:✅ IDE:❌

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

属性	类型	默认值	必填	备注	其他
longitude	Number		是	目的地经度
latitude	Number		是	目的地纬度
destination	String		是	目的地名称
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.removeCustomLayer

移除个性化图层。

参数

Object object

属性	类型	默认值	必填	说明
layerId	string		是	个性化图层id
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.removeGroundOverlay

移除自定义图片图层

参数

Object object

属性	类型	默认值	必填	说明
id	string		是	图片图层id
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.removeMarkers

移除 marker。

支持度:
系统地图(仅iOS支持)
✅

高德地图
iOS:✅ Android:✅ IDE:✅

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

Object object

属性	类型	默认值	必填	备注
markerIds	Array		是	marker 的 id 集合。
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.setBoundary

限制地图的显示范围

参数

Object object

属性	类型	默认值	必填	备注
southwest	Object		是	西南角经纬度
northeast	Object		是	东北角经纬度
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

bounds.southwest 的结构属性

结构属性	类型	默认值	必填	说明
longitude	number		是	经度
latitude	number		是	纬度

bounds.northeast 的结构属性

结构属性	类型	默认值	必填	说明
longitude	number		是	经度
latitude	number		是	纬度

MapContext.removeVisualLayer

不支持。

MapContext.setCenterOffset

设置地图中心点偏移，向后向下为增长，屏幕比例范围(0.25~0.75)，默认偏移为[0.5, 0.5]。

支持度:
系统地图(仅iOS支持)
❌

高德地图
iOS:✅ Android:✅ IDE:❌

百度地图(仅iOS、Android支持)
iOS:❌ Android:❌

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
❌

参数

属性	类型	默认值	必填	备注	其他
offset	Array.number>		是	偏移量，两位数组
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.setLocMarkerIcon

设置定位点图标，支持网络路径、本地路径、代码包路径。

支持度:
系统地图(仅iOS支持)
❌

高德地图
iOS:✅ Android:✅ IDE:❌

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
❌

参数

属性	类型	默认值	必填	备注	其他
iconPath	string		否	图标路径，支持网络路径、本地路径、代码包路径
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.toScreenLocation

获取经纬度对应的屏幕坐标，坐标原点为地图左上角。

支持度:
系统地图(仅iOS支持)
✅

高德地图
iOS:✅ Android:✅ IDE:❌

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

属性	类型	默认值	必填	备注	其他
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.translateMarker

平移marker，带动画。

支持度:
系统地图(仅iOS支持)
✅

高德地图
iOS:✅ Android:✅ IDE:✅

百度地图(仅iOS、Android支持)
iOS:✅ Android:✅

腾讯地图(仅iOS、Android支持)
iOS:✅ Android:✅

谷歌地图(仅Android支持)
✅

参数

属性	类型	默认值	必填	备注	其他
markerId	Number		是	指定 marker
destination	Object		是	指定 marker 移动到的目标点
autoRotate	boolean		是	移动过程中是否自动旋转 marker	iOS不支持 IDE不支持，默认不改变marker旋转角度
rotate	Number		是	marker 的旋转角度	iOS不支持
moveWithRotate	boolean	false	否	平移和旋转同时进行	iOS不支持 IDE不支持
duration	Number	1000	否	动画持续时长，平移与旋转分别计算
animationEnd	function		否	动画结束回调函数
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

MapContext.updateGroundOverlay

更新自定义图片图层

参数

Object object

属性	类型	默认值	必填	说明
id	String		是	图片图层 id
src	String		是	图片路径，支持网络图片、临时路径、代码包路径
bounds	Object		是	图片覆盖的经纬度范围
visible	Boolean	true	否	是否可见
zIndex	Number	1	否	图层绘制顺序
opacity	Number	1	否	图层透明度
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

object.bounds 的结构属性

属性	类型	默认值	必填	说明
southwest	Object		是	西南角经纬度
northeast	Object		是	东北角经纬度

bounds.southwest 的结构属性

结构属性	类型	默认值	必填	说明
longitude	number		是	经度
latitude	number		是	纬度

bounds.northeast 的结构属性

结构属性	类型	默认值	必填	说明
longitude	number		是	经度
latitude	number		是	纬度