@antv/l7-layers 2.25.7 → 2.25.9

package/es/utils/blend.js

@@ -0,0 +1,57 @@
+import { BlendType, gl } from '@antv/l7-core';
+export const BlendTypes = {
+  [BlendType.additive]: {
+    enable: true,
+    func: {
+      srcRGB: gl.ONE,
+      dstRGB: gl.ONE,
+      srcAlpha: 1,
+      dstAlpha: 1
+    }
+  },
+  [BlendType.none]: {
+    enable: false
+  },
+  [BlendType.normal]: {
+    enable: true,
+    func: {
+      srcRGB: gl.SRC_ALPHA,
+      dstRGB: gl.ONE_MINUS_SRC_ALPHA,
+      srcAlpha: 1,
+      dstAlpha: 1
+    }
+  },
+  [BlendType.subtractive]: {
+    enable: true,
+    func: {
+      srcRGB: gl.ONE,
+      dstRGB: gl.ONE,
+      srcAlpha: gl.ZERO,
+      dstAlpha: gl.ONE_MINUS_SRC_COLOR
+    },
+    equation: {
+      rgb: gl.FUNC_SUBTRACT,
+      alpha: gl.FUNC_SUBTRACT
+    }
+  },
+  [BlendType.max]: {
+    enable: true,
+    func: {
+      srcRGB: gl.ONE,
+      dstRGB: gl.ONE
+    },
+    equation: {
+      rgb: gl.MAX_EXT
+    }
+  },
+  [BlendType.min]: {
+    enable: true,
+    func: {
+      srcRGB: gl.ONE,
+      dstRGB: gl.ONE
+    },
+    equation: {
+      rgb: gl.MIN_EXT
+    }
+  }
+};

package/es/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/es/utils/collision-index.js

@@ -0,0 +1,87 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+// @mapbox/grid-index 并没有类似 hitTest 的单纯获取碰撞检测结果的方法，query 将导致计算大量多余的包围盒结果，因此使用改良版
+import { mat4, vec4 } from 'gl-matrix';
+import GridIndex from "./grid-index";
+/**
+ * 基于网格实现文本避让，大幅提升包围盒碰撞检测效率
+ * @see https://zhuanlan.zhihu.com/p/74373214
+ */
+export default class CollisionIndex {
+  constructor(width, height) {
+    _defineProperty(this, "width", void 0);
+    _defineProperty(this, "height", void 0);
+    _defineProperty(this, "grid", void 0);
+    _defineProperty(this, "viewportPadding", 100);
+    _defineProperty(this, "screenRightBoundary", void 0);
+    _defineProperty(this, "screenBottomBoundary", void 0);
+    _defineProperty(this, "gridRightBoundary", void 0);
+    _defineProperty(this, "gridBottomBoundary", void 0);
+    this.width = width;
+    this.height = height;
+    this.viewportPadding = Math.max(width, height);
+    // 创建网格索引
+    this.grid = new GridIndex(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 = vec4.fromValues(x, y, 0, 1);
+    const out = vec4.create();
+    // @ts-ignore
+    const mat = mat4.fromValues(...mvpMatrix);
+    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;
+  }
+}

package/es/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;
+}

package/es/utils/extrude_polyline.js

@@ -0,0 +1,319 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import { aProjectFlat } from '@antv/l7-utils';
+import { vec2 } from 'gl-matrix';
+const tmp = vec2.create();
+const capEnd = vec2.create();
+const lineA = vec2.create();
+const lineB = vec2.create();
+const tangent = vec2.create();
+export function computeMiter(lineTangent, miter, start, end, halfThick) {
+  vec2.add(lineTangent, start, end);
+  vec2.normalize(lineTangent, lineTangent);
+  miter = vec2.fromValues(-lineTangent[1], lineTangent[0]);
+  const tmpvec = vec2.fromValues(-start[1], start[0]);
+  return [halfThick / vec2.dot(miter, tmpvec), miter];
+}
+export function computeNormal(out, dir) {
+  return vec2.set(out, -dir[1], dir[0]);
+}
+export function direction(out, a, b) {
+  vec2.sub(out, a, b);
+  vec2.normalize(out, out);
+  return out;
+}
+function isPointEqual(a, b) {
+  return a[0] === b[0] && a[1] === b[1];
+}
+export function getArrayUnique(matrix) {
+  const map = new Map();
+  for (let i = 0; i < matrix.length; i++) {
+    const key = matrix[0].toString() + '-' + matrix[1].toString();
+    if (map.get(key)) {
+      matrix.splice(i, 1);
+      i++;
+    } else {
+      map.set(key, key);
+    }
+  }
+  return matrix;
+}
+export default class ExtrudePolyline {
+  constructor(opts = {}) {
+    _defineProperty(this, "complex", void 0);
+    _defineProperty(this, "join", void 0);
+    _defineProperty(this, "cap", void 0);
+    _defineProperty(this, "miterLimit", void 0);
+    _defineProperty(this, "thickness", void 0);
+    _defineProperty(this, "normal", void 0);
+    _defineProperty(this, "lastFlip", -1);
+    _defineProperty(this, "miter", vec2.fromValues(0, 0));
+    _defineProperty(this, "started", false);
+    _defineProperty(this, "dash", false);
+    _defineProperty(this, "totalDistance", 0);
+    _defineProperty(this, "currentIndex", 0);
+    this.join = opts.join || 'miter';
+    this.cap = opts.cap || 'butt';
+    this.miterLimit = opts.miterLimit || 10;
+    this.thickness = opts.thickness || 1;
+    this.dash = opts.dash || false;
+    this.complex = {
+      positions: [],
+      indices: [],
+      normals: [],
+      startIndex: 0,
+      indexes: []
+    };
+  }
+  simpleExtrude(points) {
+    const complex = this.complex;
+    if (points.length <= 1) {
+      return complex;
+    }
+    this.lastFlip = -1;
+    this.started = false;
+    this.normal = null;
+    this.totalDistance = 0;
+    const total = points.length;
+    let count = complex.startIndex;
+    for (let i = 1; i < total; i++) {
+      const last = points[i - 1];
+      const cur = points[i];
+      const next = i < points.length - 1 ? points[i + 1] : null;
+      const amt = this.simpleSegment(complex, count, last, cur, next);
+      count += amt;
+    }
+    if (this.dash) {
+      for (let i = 0; i < complex.positions.length / 6; i++) {
+        complex.positions[i * 6 + 5] = this.totalDistance;
+      }
+    }
+    complex.startIndex = complex.positions.length / 6;
+    return complex;
+  }
+  extrude(points) {
+    const complex = this.complex;
+    if (points.length <= 1) {
+      return complex;
+    }
+    this.lastFlip = -1;
+    this.started = false;
+    this.normal = null;
+    this.totalDistance = 0;
+    // 去除数组里重复的点
+    // points = getArrayUnique(points);
+    const total = points.length;
+    let count = complex.startIndex;
+    for (let i = 1; i < total; i++) {
+      const last = points[i - 1];
+      const cur = points[i];
+      const next = i < points.length - 1 ? points[i + 1] : null;
+      const amt = this.segment(complex, count, last, cur, next);
+      count += amt;
+    }
+    if (this.dash) {
+      for (let i = 0; i < complex.positions.length / 6; i++) {
+        complex.positions[i * 6 + 5] = this.totalDistance;
+      }
+    }
+    complex.startIndex = complex.positions.length / 6;
+    return complex;
+  }
+  simpleSegment(complex, index, last, cur, next) {
+    let count = 0;
+    const indices = complex.indices;
+    const positions = complex.positions;
+    const normals = complex.normals;
+    const flatCur = aProjectFlat([cur[0], cur[1]]);
+    const flatLast = aProjectFlat([last[0], last[1]]);
+    // @ts-ignore
+    direction(lineA, flatCur, flatLast);
+    let segmentDistance = 0;
+    if (this.dash) {
+      // @ts-ignore
+      segmentDistance = this.lineSegmentDistance(flatCur, flatLast);
+      this.totalDistance += segmentDistance;
+    }
+    if (!this.normal) {
+      this.normal = vec2.create();
+      computeNormal(this.normal, lineA);
+    }
+    if (!this.started) {
+      this.started = true;
+      this.extrusions(positions, normals, last, this.normal, this.thickness, this.totalDistance - segmentDistance);
+    }
+    indices.push(index + 0, index + 1, index + 2);
+    if (!next) {
+      computeNormal(this.normal, lineA);
+      this.extrusions(positions, normals, cur, this.normal, this.thickness, this.totalDistance);
+      indices.push(...(this.lastFlip === 1 ? [index, index + 2, index + 3] : [index + 2, index + 1, index + 3]));
+      count += 2;
+    } else {
+      const flatNext = aProjectFlat([next[0], next[1]]);
+      if (isPointEqual(flatCur, flatNext)) {
+        vec2.add(flatNext, flatCur, vec2.normalize(flatNext, vec2.subtract(flatNext, flatCur, flatLast)));
+      }
+      direction(lineB, flatNext, flatCur);
+
+      // stores tangent & miter
+
+      const [miterLen, miter] = computeMiter(tangent, vec2.create(), lineA, lineB, this.thickness);
+      // normal(tmp, lineA)
+
+      // get orientation
+      let flip = vec2.dot(tangent, this.normal) < 0 ? -1 : 1;
+      this.extrusions(positions, normals, cur, miter, miterLen, this.totalDistance);
+      indices.push(...(this.lastFlip === 1 ? [index, index + 2, index + 3] : [index + 2, index + 1, index + 3]));
+      flip = -1;
+
+      // the miter is now the normal for our next join
+      vec2.copy(this.normal, miter);
+      count += 2;
+      this.lastFlip = flip;
+    }
+    return count;
+  }
+  segment(complex, index, last, cur, next) {
+    let count = 0;
+    const indices = complex.indices;
+    const positions = complex.positions;
+    const normals = complex.normals;
+    const capSquare = this.cap === 'square';
+    const joinBevel = this.join === 'bevel';
+    const flatCur = aProjectFlat([cur[0], cur[1]]);
+    const flatLast = aProjectFlat([last[0], last[1]]);
+    // @ts-ignore
+    direction(lineA, flatCur, flatLast);
+    let segmentDistance = 0;
+    if (this.dash) {
+      // @ts-ignore
+      segmentDistance = this.lineSegmentDistance(flatCur, flatLast);
+      this.totalDistance += segmentDistance;
+    }
+    if (!this.normal) {
+      this.normal = vec2.create();
+      computeNormal(this.normal, lineA);
+    }
+    if (!this.started) {
+      this.started = true;
+
+      // if the end cap is type square, we can just push the verts out a bit
+      if (capSquare) {
+        // vec2.scaleAndAdd(capEnd, last, lineA, -this.thickness);
+        const out1 = vec2.create();
+        const out2 = vec2.create();
+        vec2.add(out1, this.normal, lineA);
+        vec2.add(out2, this.normal, lineA);
+        normals.push(out2[0], out2[1], 0);
+        normals.push(out1[0], out1[1], 0);
+        positions.push(last[0], last[1], last[2] | 0, this.totalDistance - segmentDistance, -this.thickness, last[2] | 0);
+        this.complex.indexes.push(this.currentIndex);
+        positions.push(last[0], last[1], last[2] | 0, this.totalDistance - segmentDistance, this.thickness, last[2] | 0);
+        this.complex.indexes.push(this.currentIndex);
+        this.currentIndex++;
+        // this.extrusions(positions, normals, last, out, this.thickness);
+        // last = capEnd;
+      } else {
+        this.extrusions(positions, normals, last, this.normal, this.thickness, this.totalDistance - segmentDistance);
+      }
+    }
+    indices.push(index + 0, index + 1, index + 2);
+    if (!next) {
+      computeNormal(this.normal, lineA);
+      if (capSquare) {
+        // vec2.scaleAndAdd(capEnd, cur, lineA, this.thickness);
+        // cur = capEnd;
+        const out1 = vec2.create();
+        const out2 = vec2.create();
+        vec2.sub(out2, lineA, this.normal);
+        vec2.add(out1, lineA, this.normal);
+        // this.extrusions(positions, normals, cur, out, this.thickness);
+        normals.push(out2[0], out2[1], 0);
+        normals.push(out1[0], out1[1], 0);
+        positions.push(cur[0], cur[1], cur[2] | 0, this.totalDistance, this.thickness, cur[2] | 0);
+        this.complex.indexes.push(this.currentIndex);
+        positions.push(cur[0], cur[1], cur[2] | 0, this.totalDistance, this.thickness, cur[2] | 0);
+        this.complex.indexes.push(this.currentIndex);
+        this.currentIndex++;
+      } else {
+        this.extrusions(positions, normals, cur, this.normal, this.thickness, this.totalDistance);
+      }
+
+      // this.extrusions(positions, normals, cur, this.normal, this.thickness);
+      indices.push(...(this.lastFlip === 1 ? [index, index + 2, index + 3] : [index + 2, index + 1, index + 3]));
+      count += 2;
+    } else {
+      const flatNext = aProjectFlat([next[0], next[1]]);
+      if (isPointEqual(flatCur, flatNext)) {
+        vec2.add(flatNext, flatCur, vec2.normalize(flatNext, vec2.subtract(flatNext, flatCur, flatLast)));
+      }
+      direction(lineB, flatNext, flatCur);
+
+      // stores tangent & miter
+
+      const [miterLen, miter] = computeMiter(tangent, vec2.create(), lineA, lineB, this.thickness);
+      // normal(tmp, lineA)
+
+      // get orientation
+      let flip = vec2.dot(tangent, this.normal) < 0 ? -1 : 1;
+      let bevel = joinBevel;
+      if (!bevel && this.join === 'miter') {
+        const limit = miterLen;
+        if (limit > this.miterLimit) {
+          bevel = true;
+        }
+      }
+      if (bevel) {
+        normals.push(this.normal[0], this.normal[1], 0);
+        normals.push(miter[0], miter[1], 0);
+        positions.push(cur[0], cur[1], cur[2] | 0, this.totalDistance, -this.thickness * flip, cur[2] | 0);
+        this.complex.indexes.push(this.currentIndex);
+        positions.push(cur[0], cur[1], cur[2] | 0, this.totalDistance, this.thickness * flip, cur[2] | 0);
+        this.complex.indexes.push(this.currentIndex);
+        this.currentIndex++;
+        indices.push(...(this.lastFlip !== -flip ? [index, index + 2, index + 3] : [index + 2, index + 1, index + 3]));
+
+        // now add the bevel triangle
+        indices.push(index + 2, index + 3, index + 4);
+        computeNormal(tmp, lineB);
+        vec2.copy(this.normal, tmp); // store normal for next round
+        normals.push(this.normal[0], this.normal[1], 0);
+        positions.push(cur[0], cur[1], cur[2] | 0, this.totalDistance, -this.thickness * flip, cur[2] | 0);
+        this.complex.indexes.push(this.currentIndex);
+        this.currentIndex++;
+        count += 3;
+      } else {
+        this.extrusions(positions, normals, cur, miter, miterLen, this.totalDistance);
+        indices.push(...(this.lastFlip === 1 ? [index, index + 2, index + 3] : [index + 2, index + 1, index + 3]));
+        flip = -1;
+
+        // the miter is now the normal for our next join
+        vec2.copy(this.normal, miter);
+        count += 2;
+      }
+      this.lastFlip = flip;
+    }
+    return count;
+  }
+  extrusions(positions, normals, point,
+  // 顶点
+  normal,
+  // 法向量
+  thickness,
+  // 高度
+  distanceRadio) {
+    normals.push(normal[0], normal[1], 0);
+    normals.push(normal[0], normal[1], 0);
+    // 修复：正确处理 z 坐标，当 point[2] 不存在时使用 0，但保留传入的高度值
+    const z = point[2] !== undefined ? point[2] : 0;
+    positions.push(point[0], point[1], z, distanceRadio, -thickness, z);
+    this.complex.indexes.push(this.currentIndex);
+    positions.push(point[0], point[1], z, distanceRadio, thickness, z);
+    this.complex.indexes.push(this.currentIndex);
+    this.currentIndex++;
+  }
+  lineSegmentDistance(b1, a1) {
+    const dx = a1[0] - b1[0];
+    const dy = a1[1] - b1[1];
+    return Math.sqrt(dx * dx + dy * dy);
+  }
+}

package/es/utils/grid-index.d.ts

@@ -0,0 +1,28 @@
+type CallBack = (...args: any[]) => any;
+/**
+ * 网格索引，相比 @mapbox/grid-index，在简单计算碰撞检测结果时效率更高
+ * @see https://zhuanlan.zhihu.com/p/74373214
+ */
+declare class GridIndex {
+    private boxCells;
+    private xCellCount;
+    private yCellCount;
+    private boxKeys;
+    private bboxes;
+    private width;
+    private height;
+    private xScale;
+    private yScale;
+    private boxUid;
+    constructor(width: number, height: number, cellSize: number);
+    insert(key: any, x1: number, y1: number, x2: number, y2: number): void;
+    query(x1: number, y1: number, x2: number, y2: number, predicate?: CallBack): boolean | any[];
+    hitTest(x1: number, y1: number, x2: number, y2: number, predicate?: CallBack): boolean | any[];
+    private insertBoxCell;
+    private queryHitTest;
+    private queryCell;
+    private forEachCell;
+    private convertToXCellCoord;
+    private convertToYCellCoord;
+}
+export default GridIndex;