1.1 初始化地图💯

TIP

Map 对象代表页面上的地图。它暴露了一系列的方法和属性使得用户可以通过编程开发对地图进行修改，并在用户与地图交互时触发一系列的事件。

您可以创建Map，通过指定的container和其他可选参数。AiMap GL JS 会在页面上初始化地图并返回您的Map对象。

目前公网服务地址：https://location-dev.newayz.com

政务网https服务地址：https://yzt.pudong.gov.cn:80

政务网http服务地址： http://yzt.pudong.gov.cn:5236

构造函数:

new Map(options: Object)

参数:

名称	类型	默认值	说明
container	HTMLElement | string		AiMap GL JS 进行地图渲染的 HTML 元素，或该元素的字符串 id 。该指定元素不能有子元素。
zoom	number		地图初始化时的层级。如果构造函数的参数中没有设置 zoom AiMap GL JS 会在地图样式中进行查找。如果样式中也没定义的话，那么它将默认为 0 。
center	LngLat	[0,0]	地图初始化时的地理中心点。如果构造函数的参数中没有设置 center ，AiMap GL JS 会在地图样式中进行查找。如果样式中也没定义的话，那么它将默认为 [0, 0] 注意: 为了与 GeoJSON 保持一致，AiMap GL 采用经度，纬度的顺序。
bearing	number	0	地图初始化时的方位角（旋转角度），以正北方的逆时针转动度数计量。如果构造函数的参数中没有设置 bearing ，AiMap GL JS 会在地图样式中进行查找。如果样式中也没定义的话，那么它将默认为 0 。
pitch	number	0	地图初始化时的倾角，按偏离屏幕水平面的度数计量（0-60）。如果构造函数的参数中没有设置 pitch ，AiMap GL JS 会在地图样式中进行查找。如果样式中也没定义的话，那么它将默认为 0 。
maxBounds	LngLatBound		如果设置，则地图将限制在给定范围内。
bounds	LngLatBound		地图初始化时的限制范围。如果设置了 bounds 将会覆盖掉 center 和 zoom 在构造函数中的参数设置。
accessToken	string		设置之后，地图将用此 token 替换掉在 aimap.accessToken 中设置的值。
minZoom	number	1	地图最小缩放级别（1-20）
maxZoom	number	20	地图最大缩放级别（1-20）
minPitch	number	0	地图最小倾角
maxPitch	number	60	地图最大倾角
style	Object | string		地图的 AiMap 配置样式。它必须是一个符合 AiMap 样式规范的 JSON 对象，或者是一个指向该 JSON 的 URL 地址。 要从AiMap API加载样式，您可以填写如下格式的 URLaimap://styles/:owner/:style， 其中 :owner 是您的 AiMap 账户名 :style 是样式 ID 。 也可以使用以下预定义 AiMap 样式: aimap://styles/aimap/default-v1
layers	Array<Layer>
controls	Array<Control>

示例:

// 引用WAYZ地图API路径

// 公网开发用
<link rel='stylesheet' href='https://location-dev.newayz.com/aimap-gl-js/v1.3.10/aimap-gl.css' />
<script src="https://location-dev.newayz.com/aimap-gl-js/v1.3.10/aimap-gl.js"></script>
aimap.baseApiUrl = "https://location-dev.newayz.com";

// 政务内网部署用
// <link rel='stylesheet' href='https://yzt.pudong.gov.cn:80/aimap-gl-js/v1.3.10/aimap-gl.css' />
// <script src="https://yzt.pudong.gov.cn:80/aimap-gl-js/v1.3.10/aimap-gl.js"></script>
// aimap.baseApiUrl = "https://yzt.pudong.gov.cn:80";

aimap.accessToken = "申请的key";

const map = new aimap.Map({
    container: 'map', //地图DOM容器
    center: [120.908028, 31.380561], //初始化显示地图中心点
    zoom: 14, //初始化显示级别
    pitch: 60, //初始化地图倾斜角度
    maxBounds:[[-180,-85],[180,85]],//禁止地图拖动发生轮循
    bearing: 0, //初始化地图旋转角度
    minZoom: 1, //地图缩放允许显示的最小层级
    maxZoom: 20, //地图缩放允许显示的最大层级
    style: "aimap://styles/aimap/cy-darkblue-v3"  //地图主题样式
});

1.2 基础控件

1.2.1 添加控件

构造函数：

map.addControl(control, position?)

参数：

字段名	类型	说明
control	IControl	要添加的控件实例
position	string	控件添加到地图的位置。 有效值包括： 'top-left' ， 'top-right' ， 'bottom-left' ，和 'bottom-right' 。默认为 'top-right'

1.2.2 缩放与默认指南针

构造函数：

new aimap.NavigationControl(options: Object?)

参数：

字段名	类型	默认值	说明
showCompass	Boolean	true	引入指南针按钮
showZoom	Boolean	true	引入放大和缩小按钮
visualizePitch	Boolean	false	旋转指南针的Y轴来显示俯仰角度

示例：

map.addControl( new aimap.NavigationControl({ showCompass: false, })
)

1.2.3 比例尺

TIP

此ScaleControl 控件用于显示图上距离和实际距离的比值（比例尺）。

构造函数：

new aimap.ScaleControl(options: Object?)

参数：

字段名	类型	默认值	说明
maxWidth	number	100	ScaleControl控件的最大长度，以像素为单位。
unit	string	'metric'	距离的单位 ( 'imperial' , 'metric' 或 'nautical' ）。

示例：

map.addControl(
    new aimap.ScaleControl({
        maxWidth: 80,
        unit: 'metric'
    })
)

1.2.4 罗盘

构造函数：

new aimap.CompassControl()

示例：

map.addControl(new aimap.CompassControl())

1.2.4 全屏

构造函数：

new aimap.FullscreenControl()

示例：

map.addControl(new aimap.FullscreenControl());

1.3 实例方法

1.3.1 隐藏底图

map.hideBaseMap()

1.3.2 显示底图

map.showBaseMap()

1.3.3 清除地图中所有的非底图的图层

map.clear()