@antv/l7-layers 2.25.7 → 2.25.9

package/lib/tile/tile/VectorTile.js

@@ -0,0 +1,95 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _Tile = _interopRequireDefault(require("./Tile"));
+var _util = require("./util");
+class VectorTile extends _Tile.default {
+  initTileLayer() {
+    var _this = this;
+    return (0, _asyncToGenerator2.default)(function* () {
+      const attributes = _this.parent.getLayerAttributeConfig();
+      const layerOptions = _this.getLayerOptions();
+      const vectorLayer = (0, _util.getTileLayer)(_this.parent.type);
+      const sourceOptions = _this.getSourceOption();
+      if (!sourceOptions) {
+        _this.isLoaded = true;
+        _this.emit('loaded');
+        return;
+      }
+      const layer = new vectorLayer((0, _objectSpread2.default)({}, layerOptions)).source(sourceOptions.data, sourceOptions.options);
+
+      // 初始化数据映射
+      Object.keys(attributes).forEach(type => {
+        var _attributes$attr, _attributes$attr2;
+        const attr = type;
+        // @ts-ignore
+        layer[attr]((_attributes$attr = attributes[attr]) === null || _attributes$attr === void 0 ? void 0 : _attributes$attr.field, (_attributes$attr2 = attributes[attr]) === null || _attributes$attr2 === void 0 ? void 0 : _attributes$attr2.values);
+      });
+      yield _this.addLayer(layer);
+      if (layerOptions.tileMask) {
+        // 瓦片数据裁剪
+        yield _this.addTileMask();
+      }
+      _this.setLayerMinMaxZoom(layer);
+      _this.isLoaded = true;
+      _this.emit('loaded');
+    })();
+  }
+  getSourceOption() {
+    const rawSource = this.parent.getSource();
+    const {
+      sourceLayer = 'defaultLayer',
+      featureId = 'id'
+    } = this.parent.getLayerConfig();
+    const features = this.getFeatures(sourceLayer);
+    return {
+      data: {
+        type: 'FeatureCollection',
+        features
+      },
+      options: {
+        parser: {
+          type: 'geojson',
+          featureId
+        },
+        transforms: rawSource.transforms
+      }
+    };
+  }
+  setLayerMinMaxZoom(layer) {
+    // 文本图层设置，可见范围
+    if (layer.getModelType() === 'text') {
+      layer.updateLayerConfig({
+        maxZoom: this.z + 1,
+        minZoom: this.z - 1
+      });
+    }
+  }
+  // 获取瓦片数据
+
+  getFeatures(sourceLayer) {
+    const source = this.sourceTile.data;
+    return source.getTileData(sourceLayer);
+  }
+
+  /**
+   * 在一个 Tile 中可能存在一个相同 ID 的 feature
+   * @param id
+   * @returns
+   */
+  getFeatureById(id) {
+    const layer = this.getMainLayer();
+    if (!layer) {
+      return [];
+    }
+    const res = layer.getSource().data.dataArray.filter(d => d._id === id);
+    return res;
+  }
+}
+exports.default = VectorTile;

package/lib/tile/tile/index.d.ts

@@ -0,0 +1,12 @@
+import type { ILayer } from '@antv/l7-core';
+import DebugTile from './DebugTile';
+import ImageTile from './ImageTile';
+import MaskLayer from './MaskTile';
+import RasterRGBTile from './RasterRGBTile';
+import RasterTerrainRGBTile from './RasterTerrainRGBTile';
+import RasterTile from './RasterTile';
+import VectorTile from './VectorTile';
+export type TileType = 'VectorTile' | 'DebugTile' | 'PolygonLayer' | 'PointLayer' | 'LineLayer' | 'RasterLayer' | 'image' | 'MaskLayer' | 'TileDebugLayer';
+export declare function getTileFactory(layer: ILayer): typeof DebugTile | typeof ImageTile | typeof MaskLayer | typeof RasterRGBTile | typeof RasterTerrainRGBTile | typeof RasterTile | typeof VectorTile;
+export * from '../interface';
+export * from './Tile';

package/lib/tile/tile/index.js

@@ -0,0 +1,76 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  getTileFactory: true
+};
+exports.getTileFactory = getTileFactory;
+var _l7Core = require("@antv/l7-core");
+var _DebugTile = _interopRequireDefault(require("./DebugTile"));
+var _ImageTile = _interopRequireDefault(require("./ImageTile"));
+var _MaskTile = _interopRequireDefault(require("./MaskTile"));
+var _RasterRGBTile = _interopRequireDefault(require("./RasterRGBTile"));
+var _RasterTerrainRGBTile = _interopRequireDefault(require("./RasterTerrainRGBTile"));
+var _RasterTile = _interopRequireDefault(require("./RasterTile"));
+var _VectorTile = _interopRequireDefault(require("./VectorTile"));
+var _interface = require("../interface");
+Object.keys(_interface).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _interface[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _interface[key];
+    }
+  });
+});
+var _Tile = require("./Tile");
+Object.keys(_Tile).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Tile[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Tile[key];
+    }
+  });
+});
+function getTileFactory(layer) {
+  const tileType = layer.type;
+  switch (tileType) {
+    case 'PolygonLayer':
+      return _VectorTile.default;
+    case 'LineLayer':
+      return _VectorTile.default;
+    case 'PointLayer':
+      return _VectorTile.default;
+    case 'TileDebugLayer':
+      return _DebugTile.default;
+    case 'MaskLayer':
+      return _MaskTile.default;
+    case 'RasterLayer':
+      const {
+        dataType
+      } = layer.getSource().parser;
+      switch (dataType) {
+        case _l7Core.RasterTileType.RGB:
+        case _l7Core.RasterTileType.CUSTOMRGB:
+          return _RasterRGBTile.default;
+        case _l7Core.RasterTileType.ARRAYBUFFER:
+        case _l7Core.RasterTileType.CUSTOMARRAYBUFFER:
+          return _RasterTile.default;
+        case _l7Core.RasterTileType.TERRAINRGB:
+        case _l7Core.RasterTileType.CUSTOMTERRAINRGB:
+          return _RasterTerrainRGBTile.default;
+        default:
+          return _ImageTile.default;
+      }
+    default:
+      return _VectorTile.default;
+  }
+}

package/lib/tile/tile/util.d.ts

@@ -0,0 +1,5 @@
+import LineLayer from '../../line';
+import PointLayer from '../../point/index';
+import PolygonLayer from '../../polygon';
+export declare function getTileLayer(type: string): typeof LineLayer | typeof PointLayer | typeof PolygonLayer;
+export declare function isNeedMask(type: string): boolean;

package/lib/tile/tile/util.js

@@ -0,0 +1,26 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getTileLayer = getTileLayer;
+exports.isNeedMask = isNeedMask;
+var _line = _interopRequireDefault(require("../../line"));
+var _index = _interopRequireDefault(require("../../point/index"));
+var _polygon = _interopRequireDefault(require("../../polygon"));
+function getTileLayer(type) {
+  if (type === 'PolygonLayer') {
+    return _polygon.default;
+  }
+  if (type === 'LineLayer') {
+    return _line.default;
+  }
+  if (type === 'PointLayer') {
+    return _index.default;
+  }
+  return _index.default;
+}
+function isNeedMask(type) {
+  return ['PolygonLayer', 'LineLayer'].indexOf(type) !== -1;
+}

package/lib/tile/utils/constants.d.ts

@@ -0,0 +1 @@
+export declare const ProxyFuncs: string[];

package/lib/tile/utils/constants.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ProxyFuncs = void 0;
+// TileLayer 需要代理的子图层的方法
+// 一般都是在 BaseLayer 上的方法
+const ProxyFuncs = exports.ProxyFuncs = [
+/**
+ * 1. 需要作用到所属子图层才会生效的方法
+ * 2. 不需要主动重新创建 model 的方法
+ */
+'shape', 'color', 'size', 'style', 'animate', 'filter', 'rotate', 'scale', 'setBlend', 'setSelect', 'setActive', 'disableMask', 'enableMask', 'addMask', 'removeMask'];

package/lib/tile/utils/utils.d.ts

@@ -0,0 +1,8 @@
+import type { ILayer } from '@antv/l7-core';
+export declare const tileVectorParser: string[];
+/**
+ * 判断当前图层是否是瓦片图层
+ * @param layer
+ * @returns
+ */
+export declare function isTileGroup(layer: ILayer): boolean;

package/lib/tile/utils/utils.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isTileGroup = isTileGroup;
+exports.tileVectorParser = void 0;
+const tileVectorParser = exports.tileVectorParser = ['mvt', 'geojsonvt', 'testTile'];
+
+/**
+ * 判断当前图层是否是瓦片图层
+ * @param layer
+ * @returns
+ */
+function isTileGroup(layer) {
+  const source = layer.getSource();
+  return tileVectorParser.includes(source.parser.type);
+}

package/lib/utils/blend.d.ts

@@ -0,0 +1,2 @@
+import type { IBlendTypes } from '@antv/l7-core';
+export declare const BlendTypes: IBlendTypes;

package/lib/utils/blend.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BlendTypes = void 0;
+var _l7Core = require("@antv/l7-core");
+const BlendTypes = exports.BlendTypes = {
+  [_l7Core.BlendType.additive]: {
+    enable: true,
+    func: {
+      srcRGB: _l7Core.gl.ONE,
+      dstRGB: _l7Core.gl.ONE,
+      srcAlpha: 1,
+      dstAlpha: 1
+    }
+  },
+  [_l7Core.BlendType.none]: {
+    enable: false
+  },
+  [_l7Core.BlendType.normal]: {
+    enable: true,
+    func: {
+      srcRGB: _l7Core.gl.SRC_ALPHA,
+      dstRGB: _l7Core.gl.ONE_MINUS_SRC_ALPHA,
+      srcAlpha: 1,
+      dstAlpha: 1
+    }
+  },
+  [_l7Core.BlendType.subtractive]: {
+    enable: true,
+    func: {
+      srcRGB: _l7Core.gl.ONE,
+      dstRGB: _l7Core.gl.ONE,
+      srcAlpha: _l7Core.gl.ZERO,
+      dstAlpha: _l7Core.gl.ONE_MINUS_SRC_COLOR
+    },
+    equation: {
+      rgb: _l7Core.gl.FUNC_SUBTRACT,
+      alpha: _l7Core.gl.FUNC_SUBTRACT
+    }
+  },
+  [_l7Core.BlendType.max]: {
+    enable: true,
+    func: {
+      srcRGB: _l7Core.gl.ONE,
+      dstRGB: _l7Core.gl.ONE
+    },
+    equation: {
+      rgb: _l7Core.gl.MAX_EXT
+    }
+  },
+  [_l7Core.BlendType.min]: {
+    enable: true,
+    func: {
+      srcRGB: _l7Core.gl.ONE,
+      dstRGB: _l7Core.gl.ONE
+    },
+    equation: {
+      rgb: _l7Core.gl.MIN_EXT
+    }
+  }
+};

package/lib/utils/collision-index.d.ts

@@ -0,0 +1,47 @@
+export interface ICollisionBox {
+    x1: number;
+    y1: number;
+    x2: number;
+    y2: number;
+    anchorPointX: number;
+    anchorPointY: number;
+}
+/**
+ * 基于网格实现文本避让，大幅提升包围盒碰撞检测效率
+ * @see https://zhuanlan.zhihu.com/p/74373214
+ */
+export default class CollisionIndex {
+    private width;
+    private height;
+    private grid;
+    private viewportPadding;
+    private screenRightBoundary;
+    private screenBottomBoundary;
+    private gridRightBoundary;
+    private gridBottomBoundary;
+    constructor(width: number, height: number);
+    placeCollisionBox(collisionBox: ICollisionBox): {
+        box: number[];
+    };
+    insertCollisionBox(box: number[], featureIndex: number): void;
+    /**
+     * 后续碰撞检测都需要投影到 viewport 坐标系
+     * @param {THREE.Matrix4} mvpMatrix mvp矩阵
+     * @param {number} x P20 平面坐标X
+     * @param {number} y P20 平面坐标Y
+     * @return {Point} projectedPoint
+     */
+    project(mvpMatrix: number[], x: number, y: number): {
+        x: number;
+        y: number;
+    };
+    /**
+     * 判断包围盒是否在整个网格内，需要加上 buffer
+     * @param {number} x1 x1
+     * @param {number} y1 y1
+     * @param {number} x2 x2
+     * @param {number} y2 y2
+     * @return {Point} isInside
+     */
+    isInsideGrid(x1: number, y1: number, x2: number, y2: number): boolean;
+}

package/lib/utils/collision-index.js

@@ -0,0 +1,96 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _glMatrix = require("gl-matrix");
+var _gridIndex = _interopRequireDefault(require("./grid-index"));
+// @mapbox/grid-index 并没有类似 hitTest 的单纯获取碰撞检测结果的方法，query 将导致计算大量多余的包围盒结果，因此使用改良版
+
+/**
+ * 基于网格实现文本避让，大幅提升包围盒碰撞检测效率
+ * @see https://zhuanlan.zhihu.com/p/74373214
+ */
+class CollisionIndex {
+  constructor(width, height) {
+    (0, _defineProperty2.default)(this, "width", void 0);
+    (0, _defineProperty2.default)(this, "height", void 0);
+    (0, _defineProperty2.default)(this, "grid", void 0);
+    (0, _defineProperty2.default)(this, "viewportPadding", 100);
+    (0, _defineProperty2.default)(this, "screenRightBoundary", void 0);
+    (0, _defineProperty2.default)(this, "screenBottomBoundary", void 0);
+    (0, _defineProperty2.default)(this, "gridRightBoundary", void 0);
+    (0, _defineProperty2.default)(this, "gridBottomBoundary", void 0);
+    this.width = width;
+    this.height = height;
+    this.viewportPadding = Math.max(width, height);
+    // 创建网格索引
+    this.grid = new _gridIndex.default(width + this.viewportPadding, height + this.viewportPadding, 25);
+    this.screenRightBoundary = width + this.viewportPadding;
+    this.screenBottomBoundary = height + this.viewportPadding;
+    this.gridRightBoundary = width + 2 * this.viewportPadding;
+    this.gridBottomBoundary = height + 2 * this.viewportPadding;
+  }
+  placeCollisionBox(collisionBox) {
+    // const projectedPoint = this.project(
+    //   mvpMatrix,
+    //   collisionBox.anchorPointX,
+    //   collisionBox.anchorPointY,
+    // );
+
+    const tlX = collisionBox.x1 + collisionBox.anchorPointX + this.viewportPadding;
+    const tlY = collisionBox.y1 + collisionBox.anchorPointY + this.viewportPadding;
+    const brX = collisionBox.x2 + collisionBox.anchorPointX + this.viewportPadding;
+    const brY = collisionBox.y2 + collisionBox.anchorPointY + this.viewportPadding;
+    if (!this.isInsideGrid(tlX, tlY, brX, brY) || this.grid.hitTest(tlX, tlY, brX, brY)) {
+      return {
+        box: []
+      };
+    }
+    return {
+      box: [tlX, tlY, brX, brY]
+    };
+  }
+  insertCollisionBox(box, featureIndex) {
+    const key = {
+      featureIndex
+    };
+    this.grid.insert(key, box[0], box[1], box[2], box[3]);
+  }
+
+  /**
+   * 后续碰撞检测都需要投影到 viewport 坐标系
+   * @param {THREE.Matrix4} mvpMatrix mvp矩阵
+   * @param {number} x P20 平面坐标X
+   * @param {number} y P20 平面坐标Y
+   * @return {Point} projectedPoint
+   */
+  project(mvpMatrix, x, y) {
+    const point = _glMatrix.vec4.fromValues(x, y, 0, 1);
+    const out = _glMatrix.vec4.create();
+    // @ts-ignore
+    const mat = _glMatrix.mat4.fromValues(...mvpMatrix);
+    _glMatrix.vec4.transformMat4(out, point, mat);
+    // GL 坐标系[-1, 1] -> viewport 坐标系[width, height]
+    return {
+      x: (out[0] / out[3] + 1) / 2 * this.width + this.viewportPadding,
+      y: (-out[1] / out[3] + 1) / 2 * this.height + this.viewportPadding
+    };
+  }
+
+  /**
+   * 判断包围盒是否在整个网格内，需要加上 buffer
+   * @param {number} x1 x1
+   * @param {number} y1 y1
+   * @param {number} x2 x2
+   * @param {number} y2 y2
+   * @return {Point} isInside
+   */
+  isInsideGrid(x1, y1, x2, y2) {
+    return x2 >= 0 && x1 < this.gridRightBoundary && y2 >= 0 && y1 < this.gridBottomBoundary;
+  }
+}
+exports.default = CollisionIndex;

package/lib/utils/extrude_polyline.d.ts

@@ -0,0 +1,53 @@
+import { vec2 } from 'gl-matrix';
+export declare function computeMiter(lineTangent: vec2, miter: vec2, start: vec2, end: vec2, halfThick: number): [number, vec2];
+export declare function computeNormal(out: vec2, dir: vec2): vec2;
+export declare function direction(out: vec2, a: vec2, b: vec2): vec2;
+export declare function getArrayUnique(matrix: number[][]): number[][];
+export interface IExtrudeLineOption {
+    join: string;
+    cap: string;
+    dash: boolean;
+    closed: boolean;
+    indexOffset: number;
+    miterLimit: number;
+    thickness: number;
+}
+export default class ExtrudePolyline {
+    complex: {
+        positions: number[];
+        indices: number[];
+        normals: number[];
+        startIndex: number;
+        indexes: number[];
+    };
+    private join;
+    private cap;
+    private miterLimit;
+    private thickness;
+    private normal;
+    private lastFlip;
+    private miter;
+    private started;
+    private dash;
+    private totalDistance;
+    private currentIndex;
+    constructor(opts?: Partial<IExtrudeLineOption>);
+    simpleExtrude(points: number[][]): {
+        positions: number[];
+        indices: number[];
+        normals: number[];
+        startIndex: number;
+        indexes: number[];
+    };
+    extrude(points: number[][]): {
+        positions: number[];
+        indices: number[];
+        normals: number[];
+        startIndex: number;
+        indexes: number[];
+    };
+    private simpleSegment;
+    private segment;
+    private extrusions;
+    private lineSegmentDistance;
+}