Skip to main content
Version: 下个版本

MapContext

MapContext 实例,可通过 Taro.createMapContext 获取。 MapContext 通过 id 跟一个 map 组件绑定,操作对应的 map 组件。

支持情况:

参考文档

方法

getCenterLocation

获取当前地图中心的经纬度。返回的是 gcj02 坐标系,可以用于 Taro.openLocation()

支持情况:

参考文档

(option?: GetCenterLocationOption) => Promise<GetCenterLocationSuccessCallbackResult>
参数类型
optionGetCenterLocationOption

setLocMarkerIcon

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

支持情况:

参考文档

(option?: SetLocMarkerIconOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionSetLocMarkerIconOption

moveToLocation

将地图中心移置当前定位点,此时需设置地图组件 show-location 为true。

支持情况:

参考文档

(option: MoveToLocationOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionMoveToLocationOption

translateMarker

平移marker,带动画

支持情况:

参考文档

(option: TranslateMarkerOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionTranslateMarkerOption

moveAlong

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

(object: any) => any

includePoints

缩放视野展示所有经纬度

支持情况:

参考文档

(option: IncludePointsOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionIncludePointsOption

getRegion

获取当前地图的视野范围

支持情况:

参考文档

(option?: GetRegionOption) => Promise<GetRegionSuccessCallbackResult>
参数类型
optionGetRegionOption

getRotate

获取当前地图的旋转角

支持情况:

参考文档

(option?: GetRotateOption) => Promise<GetRotateSuccessCallbackResult>
参数类型
optionGetRotateOption

getSkew

获取当前地图的倾斜角

支持情况:

参考文档

(option?: GetSkewOption) => Promise<GetSkewSuccessCallbackResult>
参数类型
optionGetSkewOption

getScale

获取当前地图的缩放级别

支持情况:

参考文档

(option?: GetScaleOption) => Promise<GetScaleSuccessCallbackResult>
参数类型
optionGetScaleOption

setCenterOffset

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

支持情况:

参考文档

(option: SetCenterOffsetOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionSetCenterOffsetOption

removeCustomLayer

移除个性化图层。

支持情况:

参考文档

(option: RemoveCustomLayerOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionRemoveCustomLayerOption

addCustomLayer

添加个性化图层。图层创建参考文档

支持情况:

参考文档

(option: AddCustomLayerOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionAddCustomLayerOption

addGroundOverlay

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

支持情况:

参考文档

(option: AddGroundLayerOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionAddGroundLayerOption

addVisualLayer

添加可视化图层。需要刷新时,interval 可设置的最小值为 15 s。

支持情况:

参考文档

(option: AddVisualLayerOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionAddVisualLayerOption

removeVisualLayer

移除可视化图层。

支持情况:

参考文档

(option: RemoveVisualLayerOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionRemoveVisualLayerOption

addArc

添加弧线,途经点与夹角必须设置一个。途经点必须在起终点有效坐标范围内,否则不能生成正确的弧线,同时设置夹角角度时,以夹角角度为准。夹角定义为起点到终点,与起点外切线逆时针旋转的角度。

支持情况:

参考文档

(option: AddArcOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionAddArcOption

removeArc

删除弧线。

支持情况:

参考文档

(option: RemoveArcOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionRemoveArcOption

setBoundary

限制地图的显示范围。此接口同时会限制地图的最小缩放整数级别。

支持情况:

参考文档

(option: SetBoundaryOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionSetBoundaryOption

updateGroundOverlay

更新自定义图片图层。

支持情况:

参考文档

(option: UpdateGroundOverlayOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionUpdateGroundOverlayOption

removeGroundOverlay

移除自定义图片图层。

支持情况:

参考文档

(option: RemoveGroundOverlayOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionRemoveGroundOverlayOption

toScreenLocation

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

支持情况:

参考文档

(option: ToScreenLocationOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionToScreenLocationOption

fromScreenLocation

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

支持情况:

参考文档

(option: FromScreenLocationOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionFromScreenLocationOption

openMapApp

拉起地图APP选择导航。

支持情况:

参考文档

(option: OpenMapAppOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionOpenMapAppOption

addMarkers

添加 marker。

支持情况:

参考文档

(option: AddMarkersOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionAddMarkersOption

removeMarkers

移除 marker。

支持情况:

参考文档

(option: RemoveMarkersOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionRemoveMarkersOption

initMarkerCluster

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

支持情况:

参考文档

(option?: InitMarkerClusterOption) => Promise<TaroGeneral.CallbackResult>
参数类型
optionInitMarkerClusterOption

on

监听地图事件。

支持情况:

参考文档

(event: keyof MapEvent, callback: (res: MapEventMarkerClusterCreate | MapEventMarkerClusterClick) => void) => void
参数类型说明
eventkeyof MapEvent事件名
callback(res: MapEventMarkerClusterCreate or MapEventMarkerClusterClick) => void事件的回调函数

示例代码

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

参数

GetCenterLocationOption

参数类型必填说明
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(result: GetCenterLocationSuccessCallbackResult) => void接口调用成功的回调函数

GetCenterLocationSuccessCallbackResult

参数类型说明
latitudenumber纬度
longitudenumber经度
errMsgstring调用结果

SetLocMarkerIconOption

参数类型必填说明
iconPathstring图标路径,支持网络路径、本地路径、代码包路径
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

GetRegionOption

参数类型必填说明
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(result: GetRegionSuccessCallbackResult) => void接口调用成功的回调函数

GetRegionSuccessCallbackResult

参数类型说明
northeastMapPosition东北角经纬度
southwestMapPosition西南角经纬度

GetRotateOption

参数类型必填说明
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(result: GetRotateSuccessCallbackResult) => void接口调用成功的回调函数

GetRotateSuccessCallbackResult

参数类型说明
rotatenumber旋转角
errMsgstring调用结果

GetScaleOption

参数类型必填说明
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(result: GetScaleSuccessCallbackResult) => void接口调用成功的回调函数

GetScaleSuccessCallbackResult

参数类型说明
scalenumber缩放值
errMsgstring调用结果

GetSkewOption

参数类型必填说明
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(result: GetSkewSuccessCallbackResult) => void接口调用成功的回调函数

GetSkewSuccessCallbackResult

参数类型说明
skewnumber倾斜角
errMsgstring调用结果

IncludePointsOption

参数类型必填说明
pointsMapPosition[]要显示在可视区域内的坐标点列表
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
paddingnumber[]坐标点形成的矩形边缘到地图边缘的距离,单位像素。格式为[上,右,下,左],安卓上只能识别数组第一项,上下左右的padding一致。开发者工具暂不支持padding参数。
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

MapPosition

坐标点

参数类型说明
latitudenumber纬度
longitudenumber经度

MapBoundary

经纬度范围

参数类型说明
southwestMapPosition西南角经纬度
northeastMapPosition东北角经纬度

MoveToLocationOption

参数类型必填说明
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
latitudenumber纬度
longitudenumber经度
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

TranslateMarkerOption

参数类型必填说明
autoRotateboolean移动过程中是否自动旋转 marker
destinationMapPosition指定 marker 移动到的目标点
markerIdnumber指定 marker
rotatenumbermarker 的旋转角度
animationEnd(...args: any[]) => any动画结束回调函数
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
durationnumber动画持续时长,平移与旋转分别计算
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

SetCenterOffsetOption

参数类型必填说明
offsetnumber[]偏移量,两位数组
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

RemoveCustomLayerOption

参数类型必填说明
layerIdnumber个性化图层id
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

AddCustomLayerOption

参数类型必填说明
layerIdnumber个性化图层id
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

AddGroundLayerOption

参数类型默认值必填说明
idnumber图片图层 id
srcstring图片路径,支持网络图片、临时路径、代码包路径
boundsMapBoundary图片覆盖的经纬度范围
visiblebooleantrue是否可见
zIndexnumber1图层绘制顺序
opacitynumber1图层透明度
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

AddVisualLayerOption

参数类型默认值必填说明
layerIdnumber个性化图层id(创建图层指引)
intervalnumber0刷新周期,单位秒
zIndexnumber1图层绘制顺序
opacitynumber1图层透明度
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

RemoveVisualLayerOption

参数类型必填说明
layerIdnumber可视化图层 id
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

AddArcOption

参数类型默认值必填说明
idnumber圆弧 id
startMapPosition起始点
endMapPosition终点
passMapPosition途经点
anglenumber0夹角角度
widthnumber5线宽
colorstring"#000000"线的颜色
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

RemoveArcOption

参数类型必填说明
idnumber圆弧 id
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

SetBoundaryOption

参数类型必填说明
southwestMapPosition西南角经纬度
northeastMapPosition东北角经纬度
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

UpdateGroundOverlayOption

参数类型默认值必填说明
idnumber图片图层 id
srcstring图片路径,支持网络图片、临时路径、代码包路径
boundsMapBoundary图片覆盖的经纬度范围
visiblebooleantrue是否可见
zIndexnumber1图层绘制顺序
opacitynumber1图层透明度
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

RemoveGroundOverlayOption

参数类型必填说明
idnumber图片图层 id
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

ToScreenLocationOption

参数类型必填说明
latitudenumber纬度
longitudenumber经度
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

FromScreenLocationOption

参数类型必填说明
xnumberx 坐标值
ynumbery 坐标值
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

OpenMapAppOption

参数类型必填说明
longitudenumber目的地经度
latitudenumber目的地纬度
destinationstring目的地名称
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

AddMarkersOption

参数类型默认值必填说明
markersMapProps.marker[]同传入 map 组件的 marker 属性
clearbooleanfalse是否先清空地图上所有 marker
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

RemoveMarkersOption

参数类型必填说明
markerIdsstring[]marker 的 id 集合。
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

InitMarkerClusterOption

参数类型默认值必填说明
enableDefaultStylebooleantrue启用默认的聚合样式
zoomOnClickbooleantrue点击已经聚合的标记点时是否实现聚合分离
gridSizenumber60聚合算法的可聚合距离,即距离小于该值的点会聚合至一起,以像素为单位
complete(res: TaroGeneral.CallbackResult) => void接口调用结束的回调函数(调用成功、失败都会执行)
fail(res: TaroGeneral.CallbackResult) => void接口调用失败的回调函数
success(res: TaroGeneral.CallbackResult) => void接口调用成功的回调函数

MapEvent

event 的合法值

参数类型说明
markerClusterCreateMapEventMarkerClusterCreate缩放或拖动导致新的聚合簇产生时触发,仅返回新创建的聚合簇信息
markerClusterClickMapEventMarkerClusterClick聚合簇的点击事件

MapEventMarkerClusterCreate

参数类型说明
clustersClusterInfo[]聚合簇数据

MapEventMarkerClusterClick

参数类型说明
clusterClusterInfo聚合簇

ClusterInfo

参数类型说明
clusterIdnumber聚合簇的 id
centerLatLng聚合簇的坐标
markerIdsstring[]该聚合簇内的点标记数据数组

LatLng

参数类型说明
latnumber纬度值
lngnumber经度值

API 支持度

API微信小程序H5React Native
MapContext✔️
MapContext.getCenterLocation✔️
MapContext.setLocMarkerIcon✔️
MapContext.moveToLocation✔️
MapContext.translateMarker✔️
MapContext.includePoints✔️
MapContext.getRegion✔️
MapContext.getRotate✔️
MapContext.getSkew✔️
MapContext.getScale✔️
MapContext.setCenterOffset✔️
MapContext.removeCustomLayer✔️
MapContext.addCustomLayer✔️
MapContext.addGroundOverlay✔️
MapContext.addVisualLayer✔️
MapContext.removeVisualLayer✔️
MapContext.addArc✔️
MapContext.removeArc✔️
MapContext.setBoundary✔️
MapContext.updateGroundOverlay✔️
MapContext.removeGroundOverlay✔️
MapContext.toScreenLocation✔️
MapContext.fromScreenLocation✔️
MapContext.openMapApp✔️
MapContext.addMarkers✔️
MapContext.removeMarkers✔️
MapContext.initMarkerCluster✔️
MapContext.on✔️