feat: 完成自有数据图层类型声明

VectorLayer 类型声明
LabelsLayer 类型声明
CustomLayer 类型声明
ImageLayer 类型声明
CanvasLayer 类型声明
GLCustomLayer 类型声明
HeatMap 类型声明
MapboxVectorTileLayer 类型声明

types/index.d.ts

@@ -24,6 +24,19 @@ import type {
   DistrictLayerStyle,
   DistrictLayerOptions,
 } from './layers/DistrictLayer';
+import type { VectorLayer, VectorLayerOption } from './layers/VectorLayer';
+import type { CustomLayer, CustomLayerOption } from './layers/CustomLayer';
+import type { ImageLayer, ImageLayerOption } from './layers/ImageLayer';
+import type { CanvasLayer, CanvasLayerOption } from './layers/CanvasLayer';
+import type {
+  GLCustomLayer,
+  GLCustomLayerOption,
+} from './layers/GLCustomLayer';
+import type { HeatMap, HeatMapOption } from './layers/HeatMap';
+import type {
+  MapboxVTLayerOptions,
+  MapboxVectorTileLayer,
+} from './layers/MapboxVectorTileLayer';
 
 import type GeometryUtil from './utils/GeometryUtil';
 import type DomUtil from './utils/DomUtil';
@@ -60,6 +73,22 @@ declare namespace AMap {
     DistrictLayerStyle,
     DistrictLayerOptions,
 
+    // 自有数据图层
+    VectorLayer,
+    VectorLayerOption,
+    CustomLayer,
+    CustomLayerOption,
+    ImageLayer,
+    ImageLayerOption,
+    CanvasLayer,
+    CanvasLayerOption,
+    GLCustomLayer,
+    GLCustomLayerOption,
+    HeatMap,
+    HeatMapOption,
+    MapboxVectorTileLayer,
+    MapboxVTLayerOptions,
+
     // 工具
     GeometryUtil,
     Browser,

types/layers/BaseLayer.d.ts

@@ -64,6 +64,13 @@ export declare class BaseLayer<
    * @param {Map} map
    */
   setMap(map: Map): void;
+  /**
+   * 获取绑定的 Map 实例
+   * 文档未提及。验证后存在。
+   *
+   * @param {Map} map
+   */
+  getMap(): Map;
 
   // event
   on(type: LayerEventType, fn: Function, ctx?: any, once?: boolean): this;

types/layers/CanvasLayer.d.ts

@@ -0,0 +1,44 @@
+import type Bounds from '../common/Bounds';
+import type { BaseLayer, CommonLayerOptions } from './BaseLayer';
+
+export type CanvasLayerOption = CommonLayerOptions & {
+  /** Canvas DOM 对象. 可以后续通过 setCanvas 方法设置 */
+  canvas?: HTMLCanvasElement;
+  /** canvas 的范围大小经纬度, 如果传递数字数组类型: [minlng,minlat,maxlng,maxlat] */
+  bounds?: Bounds | [number, number, number, number];
+};
+
+/**
+ * 图片图层类，用户可以将一张静态图片作为图层添加在地图上，图片图层会随缩放级别而自适应缩放。
+ * https://lbs.amap.com/api/javascript-api-v2/documentation#canvaslayer
+ * @warning 官方文档声明有误
+ *
+ * @example new AMap.CanvasLayer(opts: CanvasLayerOptions)
+ */
+export declare class CanvasLayer extends BaseLayer {
+  constructor(options?: CanvasLayerOption);
+  /**
+   * 修改显示的 Canvas
+   * @param {HTMLCanvasElement} canvas
+   */
+  setCanvas(canvas: HTMLCanvasElement): void;
+  /**
+   * 返回 Canvas 对象
+   * @returns {HTMLCanvasElement | undefined} 未设置时会返回 undefined
+   */
+  getElement(): HTMLCanvasElement | undefined;
+  /**
+   * 获取 ImageLayer 显示的范围
+   */
+  getBounds(): Bounds;
+  /**
+   * 设置 ImageLayer显示的范围
+   */
+  setBounds(bounds: CanvasLayerOption['bounds']): void;
+  /**
+   * 当canvas的内容发生改变是用于刷新图层，3D视图下调用，2D视图不需要调用
+   */
+  reFresh(): void;
+}
+
+export default CanvasLayer;

types/layers/CustomLayer.d.ts

@@ -0,0 +1,31 @@
+import type { BaseLayer, CommonLayerOptions } from './BaseLayer';
+
+export type CustomLayerOption = CommonLayerOptions & {
+  /**
+   * 绘制函数，初始化完成时候，开发者需要给该图层设定render方法，
+   * 该方法需要实现图层的绘制，API会在合适的时机自动调用该方法
+   */
+  render?: Function;
+  /** 是否主动 */
+  alwaysRender?: boolean;
+};
+
+/**
+ * 自定义图层是一种完全由开发者来指定绘制方法的图层
+ *
+ * https://lbs.amap.com/api/javascript-api-v2/documentation#customlayer
+ *
+ * @example
+ * var cLayer = new AMap.CustomLayer(document.createElement('canvas'), {
+ *    zooms: [2, 18],
+ *    zIndex: 120,
+ *    render() {
+ *        // 对 canvas 进行绘制
+ *    }
+ * })
+ */
+export declare class CustomLayer extends BaseLayer {
+  constructor(canvas: HTMLCanvasElement, options: CustomLayerOption);
+}
+
+export default CustomLayer;

types/layers/GLCustomLayer.d.ts

@@ -0,0 +1,20 @@
+import type { BaseLayer, CommonLayerOptions } from './BaseLayer';
+
+export type GLCustomLayerOption = CommonLayerOptions & {
+  /** 初始化的时候，开发者可以在这个函数参数里面获取 gl 上下文，进行一些初始化的操作。 */
+  init?: Function;
+  /** 绘制函数，初始化完成时候，开发者需要给该图层设定render方法，该方法需要实现图层的绘制，API会在合适的时机自动调用该方法 */
+  render?: Function;
+};
+
+/**
+ * 标注图层
+ * https://lbs.amap.com/api/javascript-api-v2/documentation#labelslayer
+ *
+ * @example new AMap.GLCustomLayer(opts: GLCustomLayerOptions)
+ */
+export declare class GLCustomLayer extends BaseLayer {
+  constructor(options: GLCustomLayerOption);
+}
+
+export default GLCustomLayer;

types/layers/HeatMap.d.ts

@@ -0,0 +1,106 @@
+import type Event from '../common/Event';
+import type { Map } from '../Map';
+
+export type HeatMap3DOptions = {
+  heightScale?: number;
+  heightBezier?: number[];
+  gridSize?: number;
+};
+
+export type HeatMapOption = {
+  radius?: number;
+  gradient?: Object;
+  '3d'?: HeatMap3DOptions;
+
+  zooms?: [number, number];
+  opacity?: number;
+  visible?: boolean;
+  zIndex?: number;
+
+  // 以下文档未提及，验证后存在
+  blur?: number;
+  rejectMapMask?: boolean;
+  renderOnZooming?: boolean;
+};
+
+/**
+ * 热力图，基于第三方heatmap.js实现，以特殊高亮的形式显示数据密集程度。
+ * 根据密集程度的不同，图上会呈现不同的颜色，以直观的形式展现数据密度。
+ * API引用了heatmap.js最新版本v2.0，v2.0基于新的渲染模型，具有更高的渲染效率和更强的性能。
+ * 支持chrome、firefox、safari、ie9及以上浏览器。
+ *
+ * https://lbs.amap.com/api/javascript-api-v2/documentation#heatmap
+ *
+ * 实际验证过程 HeatMap 的实现，没有采用继成 BaseLayer 的方式
+ * 但是拥有大多数类似的 API
+ *
+ * @example
+ * map.plugin(['AMap.HeatMap'], function() {
+ *   heatmap = new AMap.HeatMap(map, opts: HeatMapOptions)
+ * })
+ */
+export declare class HeatMap extends Event {
+  CLASS_NAME: string;
+  constructor(map: Map, options?: HeatMapOption);
+  /**
+   * 设置热力图展现的数据集，dataset数据集格式为： { max: Number 权重的最大值, data: Array 坐标数据集 }
+   * @param {{ max: number; data?: any[] }} dataset
+   */
+  setDataSet(dataset: { max: number; data?: any[] }): void;
+  /**
+   * 输出热力图的数据集，数据结构同setDataSet中的数据集
+   * @returns {{ max: number; data?: any[] }}
+   */
+  getDataSet(): Parameters<typeof this.setDataSet>[0];
+  /**
+   * 向热力图数据集中添加坐标点，count不填写时默认：1
+   * @param longitude
+   * @param latitude
+   * @param count
+   */
+  addDataPoint(longitude: string, latitude: string, count?: number): void;
+  /**
+   * 显示热力图
+   * @warning 文档未提及，验证存在
+   */
+  show(): void;
+  /**
+   * 隐藏热力图
+   * @warning 文档未提及，验证存在
+   */
+  hide(): void;
+  /**
+   * 设置图层层级，数字越大图层层级越高
+   * @param {number} zIndex
+   */
+  setzIndex(zIndex: number): number;
+  /**
+   * 获取图层层级
+   * @returns {number}
+   */
+  getzIndex(): number;
+  /**
+   * 获取图层参数信息
+   * @returns {Object}
+   * */
+  setOptions(): Object;
+  /**
+   * 获取图层参数信息
+   * @returns {Object}
+   * */
+  getOptions(): HeatMapOption;
+  /**
+   * 设置地图对象。
+   *
+   * @param {Map} map
+   */
+  setMap(map: Map): void;
+  /**
+   * 获取绑定的 Map 实例
+   *
+   * @param {Map} map
+   */
+  getMap(): Map;
+}
+
+export default HeatMap;

types/layers/ImageLayer.d.ts

@@ -0,0 +1,41 @@
+import type Bounds from '../common/Bounds';
+import type { BaseLayer, CommonLayerOptions } from './BaseLayer';
+
+export type ImageLayerOption = CommonLayerOptions & {
+  /** 图片地址链接 */
+  url: string;
+  /** 图片的范围大小经纬度，如果传递数字数组类型: [minlng,minlat,maxlng,maxlat] */
+  bounds?: Bounds | [number, number, number, number];
+};
+
+export type ImageLayerEventType = 'complete' | string;
+
+/**
+ * 图片图层类，用户可以将一张静态图片作为图层添加在地图上，图片图层会随缩放级别而自适应缩放。
+ * https://lbs.amap.com/api/javascript-api-v2/documentation#imagelayer
+ *
+ * @example new AMap.ImageLayer(opts: ImageLayerOptions)
+ */
+export declare class ImageLayer extends BaseLayer<ImageLayerEventType> {
+  constructor(options: ImageLayerOption);
+  /**
+   * 获取图片地址
+   * @returns {string}
+   */
+  getImageUrl(): string;
+  /**
+   * 设置图片的地址
+   * @param {string} url
+   */
+  setImageUrl(url: string): void;
+  /**
+   * 获取 ImageLayer 显示的范围
+   */
+  getBounds(): Bounds;
+  /**
+   * 设置 ImageLayer显示的范围
+   */
+  setBounds(bounds: ImageLayerOption['bounds']): void;
+}
+
+export default ImageLayer;

types/layers/LabelsLayer.d.ts

@@ -0,0 +1,62 @@
+import type { VectorOverlay } from "../overlays/VectorOverlay";
+import type { LabelMarker } from "../overlays/LabelMarker";
+
+import type { BaseLayer, CommonLayerOptions } from "./BaseLayer";
+
+export type LabelsLayerOption = CommonLayerOptions & {
+  /** 标注层内的标注是否避让 */
+  collision?: boolean;
+  /** 标注层内的标注是否允许其它标注层对它避让 */
+  allowCollision?: boolean;
+};
+
+/**
+ * 标注图层
+ * https://lbs.amap.com/api/javascript-api-v2/documentation#labelslayer
+ *
+ * @example new AMap.LabelsLayer(opts: LabelsLayerOptions)
+ */
+export declare class LabelsLayer extends BaseLayer {
+  constructor(options?: LabelsLayerOption);
+
+  /**
+   * 获取该标注是否被避让，从而没有显示
+   * @name getCollision
+   * @returns {boolean}
+   */
+  getCollision(): boolean;
+  /**
+   * 设置标注层是否支持内部标注避让
+   * @param {boolean} collision
+   */
+  setCollision(collision: boolean): void;
+  /**
+   * 获取标注层是否允许其它层标注避让
+   */
+  getAllowCollision(): boolean;
+  /**
+   * 设置标注层是否允许其它层标注避让，开启该功能可实现地图标注对 LabelMarker 的避让
+   * @param {boolean} allowCollision
+   */
+  setAllowCollision(allowCollision: boolean): void;
+  /**
+   * 将 labelMarker 添加到标注层上
+   * @param {LabelMarker | LabelMarker[]} labelMarkers
+   */
+  add(labelMarkers: LabelMarker | LabelMarker[]): void;
+  /**
+   * 将 labelMarker 从标注层上移除
+   * @param {LabelMarker | LabelMarker[]} labelMarkers
+   */
+  remove(labelMarkers: LabelMarker | LabelMarker[]): void;
+  /**
+   * 获取标注层内的所有标注对象
+   */
+  getAllOverlays(): VectorOverlay[] | undefined;
+  /**
+   * 清空 VectorLayer
+   */
+  clear(): void;
+}
+
+export default LabelsLayer;