Map(target, options)

地图类

new Map(target, options)

初始化配置

Parameters:
Name Type Description
target String | HTMLDivElement

挂载容器

options Object

海图配置

Properties
Name Type Description
center Array.<Number>

初始中心经纬度 例:[x, y],其中x为经度,y为纬度

viewportAnchor Number

场景变化锚点 (1:按照屏幕中心点缩放, 2:按照光标位置缩放)

zoomedFactor Number

缩放系数,默认2

zoom Number

当前层级,默认1

maxZoom Number

最大缩放层级

minZoom Number

最小缩放层级

dragEnable Number

地图是否可通过鼠标拖拽平移, 默认为 true

rotation Number

旋转角度 默认0,范围[-360,360]

layers Array.<SceneLayer>

图层列表

Methods

addLayer(layer)

添加图层

Parameters:
Name Type Description
layer SceneLayer

图层

delete()

删除海图

destroy()

销毁海图

fitView(rect)

显示区域

Parameters:
Name Type Description
rect Array.<Number>

矩形边界 [x, y, w, h]

getCenter()

获取中心点

Returns:
-

中心点位置 [x, y]

getLayers() → {SceneLayer}

获取所有图层

Returns:
SceneLayer -

layer 图层

getRotation() → {Number}

获取旋转角度

Returns:
Number -

rotation 旋转角度 范围-360~360度

getScale() → {Number}

获取缩放值

Returns:
Number -

缩放值

getViewport() → {MercatorViewport}

获取视图

Returns:
MercatorViewport -

视图

getZoom() → {Number}

获取缩放层级

Returns:
Number -

缩放层级

getZoomedFactor() → {Number}

获取缩放系数

Returns:
Number -

缩放系数

itemAt(x, y) → {SceneItem}

某点上最上层的目标

Parameters:
Name Type Description
x Number

经度

y Number

纬度

Returns:
SceneItem -

目标对象

items() → {Array.<SceneItem>}

获取所有目标

Returns:
Array.<SceneItem> -

目标列表

itemsAtPoint(x, y, mode) → {Array.<SceneItem>}

获取某点上所有目标

Parameters:
Name Type Default Description
x Number

经度

y Number

纬度

mode Number 1

相交模式, 如下: 0:输出列表只包含形状完全包含在选择区域内的项。与区域轮廓相交的项目不包括在内。 1:输出列表包含形状完全包含在选择区域内的两个项目,以及与区域轮廓相交的项目。这是常用模式。 2:输出列表仅包含其边界矩形完全包含在选择区域内的项目。与区域轮廓相交的项目不包括在内。 3:输出列表包含两个项目,它们的边界矩形完全包含在选择区域内,以及与区域轮廓相交的项目。这种方法通常用于确定需要重绘的区域。

Returns:
Array.<SceneItem> -

目标列表

itemsAtPolygon(polygon) → {Array.<SceneItem>}

获取矩形内的区域目标

Parameters:
Name Type Description
polygon Array.<Array.<Number>>

多边形坐标列表

Returns:
Array.<SceneItem> -

目标列表

itemsAtRect(x, y, w, h, mode) → {Array.<SceneItem>}

获取矩形内的区域目标

Parameters:
Name Type Default Description
x Number

经度

y Number

纬度

w Number

矩形宽度

h Number

矩形高度

mode Number 1

相交模式

Returns:
Array.<SceneItem> -

目标列表

on(event, fun)

监听事件

Parameters:
Name Type Description
event String

事件名称

fun function

执行回调

Example
事件如下:
| 事件名称   | 描述        |
| --------- | ---------   |
| click     | 左键点击     |
| doubleclick   | 鼠标左键双击 |
| mousemove | 鼠标移动     |
| mousedown | 鼠标按下     |
| mouseup   | 鼠标抬起     |
| keydown   | 键盘按下     |
| keyup     | 键盘抬起     |
| wheel     | 鼠标滚轮     |
| resize    | 视图缩放     |
| touchstart| 触摸开始     |
| touchmove | 触摸移动     |
| touchend  | 触摸结束     |

//点击事件
map.on('click', (e) => {
  console.log(e) //e:事件对象
})

//触摸移动
map.on('touchmove', (e) => {
  console.log(e) //e:事件对象
})

panBy()

移动海图 以像素为单位, 沿 x 方向和 y 方向移动地图, x 向右为正, y 向下为正

removeLayer(layer)

删除图层

Parameters:
Name Type Description
layer SceneLayer

图层

setCenter(center)

设置中心点

Parameters:
Name Type Description
center Array.<Number>

经纬度数组[x:经度, y:纬度]

setRotation(rotation)

设置旋转角度

Parameters:
Name Type Description
rotation Number

旋转角度 范围-360~360度

setTransformationAnchor(anchor)

设置视图在转换过程中应该如何定位场景

Parameters:
Name Type Description
anchor Number

锚点 (0:无锚点,1:以视图中心锚点,2:以鼠标位置锚点)

setZoom() → {Number}

设置缩放层级

Returns:
Number -

缩放层级

setZoomedFactor(factor)

设置缩放系数

Parameters:
Name Type Description
factor Number

缩放系数

update()

更新视图