高德地图

分类

配置

示例

说明

内容

开发者 Key

开发者 Key，高德开放平台控制台所使用的 API-KEY。开发者需要在高德地图管理后台申请 web 平台（JS API）的 key ，详情请参阅高德地图 API 文档。

中心经度

中心经度，地图当前中心点所在的经度数据。

中心纬度

中心纬度，地图当前中心点所在的纬度数据。

地图模式

地图模式，选择 2D 或 3D 模式作为基底地图，3D 模式下地图将支持三维显示（如城市模型）。

地图缩放

地图缩放，地图当前中心点的缩放等级。

点标记

点标记，可配置地图上的点标记，点标记由以下属性组成：

• id：标记点在代码中的唯一标识，可用于事件处理获取目标点击标记。

• 经度：标记点所在的坐标经度。

• 纬度：标记点所在的坐标纬度。

• 标题：标记点显示的标题。

多边形标记

多边形标记，可配置地图上的多边形标记，多边形标记由以下属性组成：

• id：多边形标记在代码中的唯一标识，可用于事件处理获取目标点击标记。

• 路径 Path：多边形标记的位置描述数组，通过一个二维坐标数组来表示组成多边形各个顶点的坐标。例如 [[116.4,39.9],[120.15,30.2],[121.3,31.2]] 可用于表示一个以北京、杭州、上海城市坐标为顶点的三角形标记。

• 填充颜色：多边形标记内部的填充颜色。

• 填充透明度：多边形标记内部填充颜色的透明度。

• 线条宽度：多边形标记外围线条的宽度。

• 线条样式：多边形标记外围线条的样式，可选择实线或虚线。

• 线条颜色：多边形标记外围线条的颜色。

• 线条透明度：多边形标记外围线条颜色的透明度。

地图插件

地图插件，可选择是否在地图上开启如下插件：

• 比例尺：在地图左下角显示当前地图缩放等级下的比例尺。

• 控制栏：在地图左上角显示指南针及旋转、倾斜操作的控制栏。

• 工具栏：在地图右下角显示一个完成地图缩放等级变更操作的工具栏。

交互

隐藏

隐藏，详情参见通用属性

隐藏时保留布局

隐藏时保留布局，详情参见通用属性

样式

外边距

外边距，详情参见通用属性

主题样式

主题样式，设置地图的底图显示样式，详情请参阅高德地图自定义主题。

名称

类型

示例

说明

longitude

number

gaodeMap.longitude

地图中心点所在经度

latitude

number

gaodeMap.latitude

地图中心点所在纬度

zoom

number

gaodeMap.zoom

地图中心点缩放等级

markers

Array<{

id: string;

longitude: number;

latitude: number;

label: string

}>

gaodeMap.markers

地图中所有点标记的集合

polygon

Array<{

id: string;

pathArr: (number, number)[];

strokeStyle: string;

fillColor: string;

fillOpacity: string;

strokeWeight: string;

strokeOpacity: string

}>

gaodeMap.polygon

地图中所有多边形标记的集合

currentSelectedPointId

string

gaodeMap.currentSelectedPointId

当前选中的点标记

currentSelectedPolygonId

string

gaodeMap.currentSelectedPolygonId

当前选中的多边形标记

clearLongitude

func

gaodeMap.clearLongitude()

清除地图中心的经度坐标

setLongitude

func

gaodeMap.setLongitude(6.4)

设置地图中心的经度坐标

clearLatitude

func

gaodeMap.clearLatitude()

清除地图中心的纬度坐标

setLatitude

func

gaodeMap.setLatitude(39.9)

设置地图中心的纬度坐标

clearZoom

func

gaodeMap.clearZoom()

清除地图中心的缩放等级

setZoom

func

gaodeMap.setZoom(10)

设置地图中心的缩放等级

clearCurrentSelectedPointId

func

gaodeMap.clearCurrentSelectedPointId()

清除地图当前选中的点标记

setCurrentSelectedPointId

func

gaodeMap.setCurrentSelectedPointId('beijing')

设置地图当前选中的点标记

setCurrentSelectedPolygonId

func

gaodeMap.setCurrentSelectedPolygonId('beijing')

设置地图当前选中的多边形标记

clearCurrentSelectedPolygonId

func

gaodeMap.clearCurrentSelectedPolygonId()

清除地图当前选中的多边形标记

panTo

func

gaodeMap.panTo([116.4,39.9])

地图中心迁移至指定坐标

配置

说明

选中标记点时触发的事件

选中多边形标记时触发的事件