@antv/l7-layers 2.24.0 → 2.24.2

package/es/core/interface.d.ts

@@ -80,6 +80,7 @@ export interface IPointLayerStyleOptions extends IBaseLayerStyleOptions {
     fontWeight?: string;
     fontFamily?: string;
     textAllowOverlap?: boolean;
+    allowOverlap?: boolean;
     pickLight?: boolean;
     sourceColor?: string;
     targetColor?: string;

package/es/core/triangulation.js

@@ -112,6 +112,17 @@ export function PointExtrudeTriangulation(feature) {
  * @param feature 映射feature
  */
 export function PointImageTriangulation(feature) {
+  // @ts-ignore
+  const that = this;
+  const id = feature.id;
+  // 当 imageFilterMap 存在且该 feature 未通过碰撞检测时，返回空几何（等效隐藏）
+  if (that !== null && that !== void 0 && that.imageFilterMap && !that.imageFilterMap[id]) {
+    return {
+      vertices: [],
+      indices: [],
+      size: 3
+    };
+  }
   const coordinates = calculateCentroid(feature.coordinates);
   return {
     vertices: [...coordinates],

package/es/plugins/index.d.ts

@@ -12,4 +12,4 @@ import RegisterStyleAttributePlugin from './RegisterStyleAttributePlugin';
 import ShaderUniformPlugin from './ShaderUniformPlugin';
 import UpdateModelPlugin from './UpdateModelPlugin';
 import UpdateStyleAttributePlugin from './UpdateStyleAttributePlugin';
-export declare function createPlugins(): (DataSourcePlugin | RegisterStyleAttributePlugin | FeatureScalePlugin | DataMappingPlugin | LayerStylePlugin | LayerMaskPlugin | UpdateStyleAttributePlugin | UpdateModelPlugin | MultiPassRendererPlugin | ShaderUniformPlugin | LayerAnimateStylePlugin | LightingPlugin | PixelPickingPlugin | LayerModelPlugin)[];
+export declare function createPlugins(): (DataMappingPlugin | DataSourcePlugin | FeatureScalePlugin | LayerAnimateStylePlugin | LayerMaskPlugin | LayerModelPlugin | LayerStylePlugin | LightingPlugin | MultiPassRendererPlugin | PixelPickingPlugin | RegisterStyleAttributePlugin | ShaderUniformPlugin | UpdateModelPlugin | UpdateStyleAttributePlugin)[];

package/es/point/index.d.ts

@@ -1,3 +1,4 @@
+import type { ILayer, ILayerConfig } from '@antv/l7-core';
 import BaseLayer from '../core/BaseLayer';
 import type { IPointLayerStyleOptions } from '../core/interface';
 import type { PointType } from './models/index';
@@ -17,6 +18,7 @@ export default class PointLayer extends BaseLayer<IPointLayerStyleOptions> {
     };
     buildModels(): Promise<void>;
     rebuildModels(): Promise<void>;
+    style(options: Partial<IPointLayerStyleOptions> & Partial<ILayerConfig>): ILayer;
     /**
      * 在未传入数据的时候判断点图层的 shape 类型
      * @returns

package/es/point/index.js

@@ -37,6 +37,16 @@ export default class PointLayer extends BaseLayer {
       yield _this2.buildModels();
     })();
   }
+  style(options) {
+    super.style(options);
+    // allowOverlap 依赖 needUpdate() 感知变化并重建 model，而 needUpdate() 仅在渲染帧的
+    // beforeRender 钩子中被调用。style() 本身不触发渲染，因此在 allowOverlap 出现时
+    // 主动触发一次 reRender，确保静止地图下也能即时生效。
+    if ('allowOverlap' in options) {
+      this.reRender();
+    }
+    return this;
+  }
 
   /**
    * 在未传入数据的时候判断点图层的 shape 类型

package/es/point/models/fill.js

@@ -50,7 +50,7 @@ export default class FillModel extends BaseModel {
     } = this.layer.getLayerConfig();
     return {
       u_animate: this.animateOption2Array(animateOption),
-      u_time: this.layer.getLayerAnimateTime()
+      u_time: animateOption.enable ? this.layer.getLayerAnimateTime() : -1.0
     };
   }
   getAttribute() {

package/es/point/models/image.d.ts

@@ -17,6 +17,12 @@ export default class ImageModel extends BaseModel {
         UV: number;
     };
     private texture;
+    imageFilterMap: {
+        [key: number]: boolean;
+    } | null;
+    private currentZoom;
+    private extent;
+    private preAllowOverlap;
     getUninforms(): IModelUniform;
     protected getCommonUniformsInfo(): {
         uniformsArray: number[];
@@ -26,8 +32,17 @@ export default class ImageModel extends BaseModel {
         };
     };
     initModels(): Promise<IModel[]>;
-    clearModels(): void;
     buildModels(): Promise<IModel[]>;
+    needUpdate(): Promise<boolean>;
+    clearModels(): void;
     protected registerBuiltinAttributes(): void;
+    /**
+     * 图标碰撞避让：遍历所有 feature，在屏幕空间做 AABB 碰撞检测，
+     * 将通过检测的 feature id 写入 imageFilterMap。
+     * PointImageTriangulation 绑定 this 后，会跳过不在 map 中的 feature。
+     */
+    private filterImages;
+    private imageExtent;
+    private reBuildModel;
     private updateTexture;
 }

package/es/point/models/image.js

@@ -2,8 +2,10 @@ import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import { AttributeType, gl } from '@antv/l7-core';
+import { boundsContains, calculateCentroid, padBounds } from '@antv/l7-utils';
 import BaseModel from "../../core/BaseModel";
 import { PointImageTriangulation } from "../../core/triangulation";
+import CollisionIndex from "../../utils/collision-index";
 /* babel-plugin-inline-import '../shaders/image/image_frag.glsl' */
 const pointImageFrag = "layout(std140) uniform commonUniforms {\n  vec2 u_textSize;\n  float u_raisingHeight;\n  float u_heightfixed;\n};\n\nuniform sampler2D u_texture;\n\nin vec4 v_color;\nin vec2 v_uv;\nin float v_opacity;\n\n#pragma include \"picking\"\n\nout vec4 outputColor;\n\nvoid main() {\n  vec2 pos = v_uv / u_textSize + gl_PointCoord / u_textSize * 64.0;\n  vec4 textureColor;\n\n  // Y = 0.299R + 0.587G + 0.114B // \u4EAE\u5EA6\u63D0\u53D6\n\n  textureColor = texture(SAMPLER_2D(u_texture), pos);\n\n  // Tip: \u53BB\u9664\u8FB9\u7F18\u90E8\u5206 mipmap \u5BFC\u81F4\u7684\u6DF7\u5408\u53D8\u6697\n  float fragmengTocenter = distance(vec2(0.5), gl_PointCoord);\n  if (fragmengTocenter >= 0.5) {\n    float luma = 0.299 * textureColor.r + 0.587 * textureColor.g + 0.114 * textureColor.b;\n    textureColor.a *= luma;\n  }\n\n  if (\n    all(lessThan(v_color, vec4(1.0 + 0.00001))) && all(greaterThan(v_color, vec4(1.0 - 0.00001))) ||\n    v_color == vec4(1.0)\n  ) {\n    outputColor = textureColor;\n  } else {\n    outputColor = step(0.01, textureColor.z) * v_color;\n  }\n  outputColor.a *= v_opacity;\n  if (outputColor.a < 0.01) {\n    discard;\n  }\n  outputColor = filterColor(outputColor);\n}\n";
 /* babel-plugin-inline-import '../shaders/image/image_vert.glsl' */
@@ -12,6 +14,11 @@ export default class ImageModel extends BaseModel {
   constructor(...args) {
     super(...args);
     _defineProperty(this, "texture", void 0);
+    // 通过碰撞检测的 feature id 集合，由 filterImages() 填充；null 表示不启用过滤（allowOverlap: true）
+    _defineProperty(this, "imageFilterMap", null);
+    _defineProperty(this, "currentZoom", -1);
+    _defineProperty(this, "extent", void 0);
+    _defineProperty(this, "preAllowOverlap", true);
     _defineProperty(this, "updateTexture", () => {
       const {
         createTexture2D
@@ -78,25 +85,35 @@ export default class ImageModel extends BaseModel {
   initModels() {
     var _this = this;
     return _asyncToGenerator(function* () {
+      const {
+        allowOverlap = true
+      } = _this.layer.getLayerConfig();
+      _this.extent = _this.imageExtent();
+      _this.preAllowOverlap = allowOverlap;
       _this.iconService.on('imageUpdate', _this.updateTexture);
       _this.updateTexture();
       return _this.buildModels();
     })();
   }
-  clearModels() {
-    var _this$texture2;
-    (_this$texture2 = this.texture) === null || _this$texture2 === void 0 || _this$texture2.destroy();
-    this.iconService.off('imageUpdate', this.updateTexture);
-  }
   buildModels() {
     var _this2 = this;
     return _asyncToGenerator(function* () {
+      const {
+        allowOverlap = true
+      } = _this2.layer.getLayerConfig();
       _this2.initUniformsBuffer();
+      if (!allowOverlap) {
+        _this2.filterImages();
+      } else {
+        // 允许压盖时置 null，PointImageTriangulation 检测到 null 则跳过过滤
+        _this2.imageFilterMap = null;
+      }
       const model = yield _this2.layer.buildLayerModel({
         moduleName: 'pointImage',
         vertexShader: pointImageVert,
         fragmentShader: pointImageFrag,
-        triangulation: PointImageTriangulation,
+        // 绑定 this，让 PointImageTriangulation 能读取 imageFilterMap
+        triangulation: PointImageTriangulation.bind(_this2),
         defines: _this2.getDefines(),
         inject: _this2.getInject(),
         depth: {
@@ -107,6 +124,41 @@ export default class ImageModel extends BaseModel {
       return [model];
     })();
   }
+  needUpdate() {
+    var _this3 = this;
+    return _asyncToGenerator(function* () {
+      const {
+        allowOverlap = true
+      } = _this3.layer.getLayerConfig();
+
+      // allowOverlap 开关发生变化时，强制重建
+      if (allowOverlap !== _this3.preAllowOverlap) {
+        _this3.preAllowOverlap = allowOverlap;
+        yield _this3.reBuildModel();
+        return true;
+      }
+
+      // 允许压盖时无需每帧检测
+      if (allowOverlap) {
+        return false;
+      }
+
+      // 不允许压盖时，zoom 变化 >0.5 或视野超出上次范围则重算碰撞
+      const zoom = _this3.mapService.getZoom();
+      const extent = _this3.mapService.getBounds();
+      const flag = boundsContains(_this3.extent, extent);
+      if (Math.abs(_this3.currentZoom - zoom) > 0.5 || !flag) {
+        yield _this3.reBuildModel();
+        return true;
+      }
+      return false;
+    })();
+  }
+  clearModels() {
+    var _this$texture2;
+    (_this$texture2 = this.texture) === null || _this$texture2 === void 0 || _this$texture2.destroy();
+    this.iconService.off('imageUpdate', this.updateTexture);
+  }
   registerBuiltinAttributes() {
     // 注册 Position 属性 64 位地位部分，经纬度数据开启双精度，避免大于 20层级以上出现数据偏移
     this.registerPosition64LowAttribute();
@@ -165,4 +217,77 @@ export default class ImageModel extends BaseModel {
       }
     });
   }
+
+  /**
+   * 图标碰撞避让：遍历所有 feature，在屏幕空间做 AABB 碰撞检测，
+   * 将通过检测的 feature id 写入 imageFilterMap。
+   * PointImageTriangulation 绑定 this 后，会跳过不在 map 中的 feature。
+   */
+  filterImages() {
+    const {
+      padding = [0, 0]
+    } = this.layer.getLayerConfig();
+    this.imageFilterMap = {};
+    this.currentZoom = this.mapService.getZoom();
+    this.extent = this.imageExtent();
+    const {
+      width,
+      height
+    } = this.rendererService.getViewportSize();
+    const collisionIndex = new CollisionIndex(width, height);
+    const data = this.layer.getEncodedData();
+    data.forEach(feature => {
+      const {
+        id = 0,
+        size = 5
+      } = feature;
+      const iconSize = Array.isArray(size) ? size[0] : size;
+      const centroid = calculateCentroid(feature.coordinates);
+      const pixels = this.mapService.lngLatToContainer(centroid);
+      const {
+        box
+      } = collisionIndex.placeCollisionBox({
+        x1: -iconSize - padding[0],
+        x2: iconSize + padding[0],
+        y1: -iconSize - padding[1],
+        y2: iconSize + padding[1],
+        anchorPointX: pixels.x,
+        anchorPointY: pixels.y
+      });
+      if (box && box.length) {
+        collisionIndex.insertCollisionBox(box, id);
+        this.imageFilterMap[id] = true;
+      }
+    });
+  }
+  imageExtent() {
+    const bounds = this.mapService.getBounds();
+    return padBounds(bounds, 0.5);
+  }
+  reBuildModel() {
+    var _this4 = this;
+    return _asyncToGenerator(function* () {
+      const {
+        allowOverlap = true
+      } = _this4.layer.getLayerConfig();
+      if (!allowOverlap) {
+        _this4.filterImages();
+      } else {
+        _this4.imageFilterMap = null; // 允许压盖：清空过滤表，全量渲染
+      }
+      const model = yield _this4.layer.buildLayerModel({
+        moduleName: 'pointImage',
+        vertexShader: pointImageVert,
+        fragmentShader: pointImageFrag,
+        triangulation: PointImageTriangulation.bind(_this4),
+        defines: _this4.getDefines(),
+        inject: _this4.getInject(),
+        depth: {
+          enable: false
+        },
+        primitive: gl.POINTS
+      });
+      _this4.layer.models = [model];
+    })();
+  }
 }

package/es/tile/tile/Tile.d.ts

@@ -47,7 +47,7 @@ export default abstract class Tile extends EventEmitter implements ITile {
         enablePropagation?: boolean | undefined;
         fitBoundsOptions?: unknown;
         name?: string | undefined;
-        blend?: "normal" | "additive" | "subtractive" | "min" | "max" | "none" | undefined;
+        blend?: "min" | "max" | "normal" | "additive" | "subtractive" | "none" | undefined;
         depth?: boolean | undefined;
         pickedFeatureID?: number | undefined;
         enableMultiPassRenderer?: boolean | undefined;

package/es/tile/tile/index.d.ts

@@ -7,6 +7,6 @@ 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 VectorTile | typeof MaskLayer | typeof RasterRGBTile | typeof RasterTile | typeof RasterTerrainRGBTile;
+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/core/interface.d.ts

@@ -80,6 +80,7 @@ export interface IPointLayerStyleOptions extends IBaseLayerStyleOptions {
     fontWeight?: string;
     fontFamily?: string;
     textAllowOverlap?: boolean;
+    allowOverlap?: boolean;
     pickLight?: boolean;
     sourceColor?: string;
     targetColor?: string;

package/lib/core/triangulation.js

@@ -139,6 +139,17 @@ function PointExtrudeTriangulation(feature) {
  * @param feature 映射feature
  */
 function PointImageTriangulation(feature) {
+  // @ts-ignore
+  const that = this;
+  const id = feature.id;
+  // 当 imageFilterMap 存在且该 feature 未通过碰撞检测时，返回空几何（等效隐藏）
+  if (that !== null && that !== void 0 && that.imageFilterMap && !that.imageFilterMap[id]) {
+    return {
+      vertices: [],
+      indices: [],
+      size: 3
+    };
+  }
   const coordinates = (0, _l7Utils.calculateCentroid)(feature.coordinates);
   return {
     vertices: [...coordinates],

package/lib/plugins/index.d.ts

@@ -12,4 +12,4 @@ import RegisterStyleAttributePlugin from './RegisterStyleAttributePlugin';
 import ShaderUniformPlugin from './ShaderUniformPlugin';
 import UpdateModelPlugin from './UpdateModelPlugin';
 import UpdateStyleAttributePlugin from './UpdateStyleAttributePlugin';
-export declare function createPlugins(): (DataSourcePlugin | RegisterStyleAttributePlugin | FeatureScalePlugin | DataMappingPlugin | LayerStylePlugin | LayerMaskPlugin | UpdateStyleAttributePlugin | UpdateModelPlugin | MultiPassRendererPlugin | ShaderUniformPlugin | LayerAnimateStylePlugin | LightingPlugin | PixelPickingPlugin | LayerModelPlugin)[];
+export declare function createPlugins(): (DataMappingPlugin | DataSourcePlugin | FeatureScalePlugin | LayerAnimateStylePlugin | LayerMaskPlugin | LayerModelPlugin | LayerStylePlugin | LightingPlugin | MultiPassRendererPlugin | PixelPickingPlugin | RegisterStyleAttributePlugin | ShaderUniformPlugin | UpdateModelPlugin | UpdateStyleAttributePlugin)[];

package/lib/point/index.d.ts

@@ -1,3 +1,4 @@
+import type { ILayer, ILayerConfig } from '@antv/l7-core';
 import BaseLayer from '../core/BaseLayer';
 import type { IPointLayerStyleOptions } from '../core/interface';
 import type { PointType } from './models/index';
@@ -17,6 +18,7 @@ export default class PointLayer extends BaseLayer<IPointLayerStyleOptions> {
     };
     buildModels(): Promise<void>;
     rebuildModels(): Promise<void>;
+    style(options: Partial<IPointLayerStyleOptions> & Partial<ILayerConfig>): ILayer;
     /**
      * 在未传入数据的时候判断点图层的 shape 类型
      * @returns

package/lib/point/index.js

@@ -44,6 +44,16 @@ class PointLayer extends _BaseLayer.default {
       yield _this2.buildModels();
     })();
   }
+  style(options) {
+    super.style(options);
+    // allowOverlap 依赖 needUpdate() 感知变化并重建 model，而 needUpdate() 仅在渲染帧的
+    // beforeRender 钩子中被调用。style() 本身不触发渲染，因此在 allowOverlap 出现时
+    // 主动触发一次 reRender，确保静止地图下也能即时生效。
+    if ('allowOverlap' in options) {
+      this.reRender();
+    }
+    return this;
+  }
 
   /**
    * 在未传入数据的时候判断点图层的 shape 类型

package/lib/point/models/fill.js

@@ -57,7 +57,7 @@ class FillModel extends _BaseModel.default {
     } = this.layer.getLayerConfig();
     return {
       u_animate: this.animateOption2Array(animateOption),
-      u_time: this.layer.getLayerAnimateTime()
+      u_time: animateOption.enable ? this.layer.getLayerAnimateTime() : -1.0
     };
   }
   getAttribute() {

package/lib/point/models/image.d.ts

@@ -17,6 +17,12 @@ export default class ImageModel extends BaseModel {
         UV: number;
     };
     private texture;
+    imageFilterMap: {
+        [key: number]: boolean;
+    } | null;
+    private currentZoom;
+    private extent;
+    private preAllowOverlap;
     getUninforms(): IModelUniform;
     protected getCommonUniformsInfo(): {
         uniformsArray: number[];
@@ -26,8 +32,17 @@ export default class ImageModel extends BaseModel {
         };
     };
     initModels(): Promise<IModel[]>;
-    clearModels(): void;
     buildModels(): Promise<IModel[]>;
+    needUpdate(): Promise<boolean>;
+    clearModels(): void;
     protected registerBuiltinAttributes(): void;
+    /**
+     * 图标碰撞避让：遍历所有 feature，在屏幕空间做 AABB 碰撞检测，
+     * 将通过检测的 feature id 写入 imageFilterMap。
+     * PointImageTriangulation 绑定 this 后，会跳过不在 map 中的 feature。
+     */
+    private filterImages;
+    private imageExtent;
+    private reBuildModel;
     private updateTexture;
 }

package/lib/point/models/image.js

@@ -9,8 +9,10 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _l7Core = require("@antv/l7-core");
+var _l7Utils = require("@antv/l7-utils");
 var _BaseModel = _interopRequireDefault(require("../../core/BaseModel"));
 var _triangulation = require("../../core/triangulation");
+var _collisionIndex = _interopRequireDefault(require("../../utils/collision-index"));
 /* babel-plugin-inline-import '../shaders/image/image_frag.glsl' */
 const pointImageFrag = "layout(std140) uniform commonUniforms {\n  vec2 u_textSize;\n  float u_raisingHeight;\n  float u_heightfixed;\n};\n\nuniform sampler2D u_texture;\n\nin vec4 v_color;\nin vec2 v_uv;\nin float v_opacity;\n\n#pragma include \"picking\"\n\nout vec4 outputColor;\n\nvoid main() {\n  vec2 pos = v_uv / u_textSize + gl_PointCoord / u_textSize * 64.0;\n  vec4 textureColor;\n\n  // Y = 0.299R + 0.587G + 0.114B // \u4EAE\u5EA6\u63D0\u53D6\n\n  textureColor = texture(SAMPLER_2D(u_texture), pos);\n\n  // Tip: \u53BB\u9664\u8FB9\u7F18\u90E8\u5206 mipmap \u5BFC\u81F4\u7684\u6DF7\u5408\u53D8\u6697\n  float fragmengTocenter = distance(vec2(0.5), gl_PointCoord);\n  if (fragmengTocenter >= 0.5) {\n    float luma = 0.299 * textureColor.r + 0.587 * textureColor.g + 0.114 * textureColor.b;\n    textureColor.a *= luma;\n  }\n\n  if (\n    all(lessThan(v_color, vec4(1.0 + 0.00001))) && all(greaterThan(v_color, vec4(1.0 - 0.00001))) ||\n    v_color == vec4(1.0)\n  ) {\n    outputColor = textureColor;\n  } else {\n    outputColor = step(0.01, textureColor.z) * v_color;\n  }\n  outputColor.a *= v_opacity;\n  if (outputColor.a < 0.01) {\n    discard;\n  }\n  outputColor = filterColor(outputColor);\n}\n";
 /* babel-plugin-inline-import '../shaders/image/image_vert.glsl' */
@@ -19,6 +21,11 @@ class ImageModel extends _BaseModel.default {
   constructor(...args) {
     super(...args);
     (0, _defineProperty2.default)(this, "texture", void 0);
+    // 通过碰撞检测的 feature id 集合，由 filterImages() 填充；null 表示不启用过滤（allowOverlap: true）
+    (0, _defineProperty2.default)(this, "imageFilterMap", null);
+    (0, _defineProperty2.default)(this, "currentZoom", -1);
+    (0, _defineProperty2.default)(this, "extent", void 0);
+    (0, _defineProperty2.default)(this, "preAllowOverlap", true);
     (0, _defineProperty2.default)(this, "updateTexture", () => {
       const {
         createTexture2D
@@ -85,25 +92,35 @@ class ImageModel extends _BaseModel.default {
   initModels() {
     var _this = this;
     return (0, _asyncToGenerator2.default)(function* () {
+      const {
+        allowOverlap = true
+      } = _this.layer.getLayerConfig();
+      _this.extent = _this.imageExtent();
+      _this.preAllowOverlap = allowOverlap;
       _this.iconService.on('imageUpdate', _this.updateTexture);
       _this.updateTexture();
       return _this.buildModels();
     })();
   }
-  clearModels() {
-    var _this$texture2;
-    (_this$texture2 = this.texture) === null || _this$texture2 === void 0 || _this$texture2.destroy();
-    this.iconService.off('imageUpdate', this.updateTexture);
-  }
   buildModels() {
     var _this2 = this;
     return (0, _asyncToGenerator2.default)(function* () {
+      const {
+        allowOverlap = true
+      } = _this2.layer.getLayerConfig();
       _this2.initUniformsBuffer();
+      if (!allowOverlap) {
+        _this2.filterImages();
+      } else {
+        // 允许压盖时置 null，PointImageTriangulation 检测到 null 则跳过过滤
+        _this2.imageFilterMap = null;
+      }
       const model = yield _this2.layer.buildLayerModel({
         moduleName: 'pointImage',
         vertexShader: pointImageVert,
         fragmentShader: pointImageFrag,
-        triangulation: _triangulation.PointImageTriangulation,
+        // 绑定 this，让 PointImageTriangulation 能读取 imageFilterMap
+        triangulation: _triangulation.PointImageTriangulation.bind(_this2),
         defines: _this2.getDefines(),
         inject: _this2.getInject(),
         depth: {
@@ -114,6 +131,41 @@ class ImageModel extends _BaseModel.default {
       return [model];
     })();
   }
+  needUpdate() {
+    var _this3 = this;
+    return (0, _asyncToGenerator2.default)(function* () {
+      const {
+        allowOverlap = true
+      } = _this3.layer.getLayerConfig();
+
+      // allowOverlap 开关发生变化时，强制重建
+      if (allowOverlap !== _this3.preAllowOverlap) {
+        _this3.preAllowOverlap = allowOverlap;
+        yield _this3.reBuildModel();
+        return true;
+      }
+
+      // 允许压盖时无需每帧检测
+      if (allowOverlap) {
+        return false;
+      }
+
+      // 不允许压盖时，zoom 变化 >0.5 或视野超出上次范围则重算碰撞
+      const zoom = _this3.mapService.getZoom();
+      const extent = _this3.mapService.getBounds();
+      const flag = (0, _l7Utils.boundsContains)(_this3.extent, extent);
+      if (Math.abs(_this3.currentZoom - zoom) > 0.5 || !flag) {
+        yield _this3.reBuildModel();
+        return true;
+      }
+      return false;
+    })();
+  }
+  clearModels() {
+    var _this$texture2;
+    (_this$texture2 = this.texture) === null || _this$texture2 === void 0 || _this$texture2.destroy();
+    this.iconService.off('imageUpdate', this.updateTexture);
+  }
   registerBuiltinAttributes() {
     // 注册 Position 属性 64 位地位部分，经纬度数据开启双精度，避免大于 20层级以上出现数据偏移
     this.registerPosition64LowAttribute();
@@ -172,5 +224,78 @@ class ImageModel extends _BaseModel.default {
       }
     });
   }
+
+  /**
+   * 图标碰撞避让：遍历所有 feature，在屏幕空间做 AABB 碰撞检测，
+   * 将通过检测的 feature id 写入 imageFilterMap。
+   * PointImageTriangulation 绑定 this 后，会跳过不在 map 中的 feature。
+   */
+  filterImages() {
+    const {
+      padding = [0, 0]
+    } = this.layer.getLayerConfig();
+    this.imageFilterMap = {};
+    this.currentZoom = this.mapService.getZoom();
+    this.extent = this.imageExtent();
+    const {
+      width,
+      height
+    } = this.rendererService.getViewportSize();
+    const collisionIndex = new _collisionIndex.default(width, height);
+    const data = this.layer.getEncodedData();
+    data.forEach(feature => {
+      const {
+        id = 0,
+        size = 5
+      } = feature;
+      const iconSize = Array.isArray(size) ? size[0] : size;
+      const centroid = (0, _l7Utils.calculateCentroid)(feature.coordinates);
+      const pixels = this.mapService.lngLatToContainer(centroid);
+      const {
+        box
+      } = collisionIndex.placeCollisionBox({
+        x1: -iconSize - padding[0],
+        x2: iconSize + padding[0],
+        y1: -iconSize - padding[1],
+        y2: iconSize + padding[1],
+        anchorPointX: pixels.x,
+        anchorPointY: pixels.y
+      });
+      if (box && box.length) {
+        collisionIndex.insertCollisionBox(box, id);
+        this.imageFilterMap[id] = true;
+      }
+    });
+  }
+  imageExtent() {
+    const bounds = this.mapService.getBounds();
+    return (0, _l7Utils.padBounds)(bounds, 0.5);
+  }
+  reBuildModel() {
+    var _this4 = this;
+    return (0, _asyncToGenerator2.default)(function* () {
+      const {
+        allowOverlap = true
+      } = _this4.layer.getLayerConfig();
+      if (!allowOverlap) {
+        _this4.filterImages();
+      } else {
+        _this4.imageFilterMap = null; // 允许压盖：清空过滤表，全量渲染
+      }
+      const model = yield _this4.layer.buildLayerModel({
+        moduleName: 'pointImage',
+        vertexShader: pointImageVert,
+        fragmentShader: pointImageFrag,
+        triangulation: _triangulation.PointImageTriangulation.bind(_this4),
+        defines: _this4.getDefines(),
+        inject: _this4.getInject(),
+        depth: {
+          enable: false
+        },
+        primitive: _l7Core.gl.POINTS
+      });
+      _this4.layer.models = [model];
+    })();
+  }
 }
 exports.default = ImageModel;

package/lib/tile/tile/Tile.d.ts

@@ -47,7 +47,7 @@ export default abstract class Tile extends EventEmitter implements ITile {
         enablePropagation?: boolean | undefined;
         fitBoundsOptions?: unknown;
         name?: string | undefined;
-        blend?: "normal" | "additive" | "subtractive" | "min" | "max" | "none" | undefined;
+        blend?: "min" | "max" | "normal" | "additive" | "subtractive" | "none" | undefined;
         depth?: boolean | undefined;
         pickedFeatureID?: number | undefined;
         enableMultiPassRenderer?: boolean | undefined;

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

@@ -7,6 +7,6 @@ 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 VectorTile | typeof MaskLayer | typeof RasterRGBTile | typeof RasterTile | typeof RasterTerrainRGBTile;
+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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7-layers",
-  "version": "2.24.0",
+  "version": "2.24.2",
   "description": "L7's collection of built-in layers",
   "license": "MIT",
   "author": "https://github.com/orgs/antvis/people",
@@ -26,15 +26,15 @@
     "earcut": "^2.2.1",
     "eventemitter3": "^4.0.0",
     "gl-matrix": "^3.1.0",
-    "@antv/l7-maps": "2.24.0",
-    "@antv/l7-utils": "2.24.0",
-    "@antv/l7-core": "2.24.0",
-    "@antv/l7-source": "2.24.0"
+    "@antv/l7-maps": "2.24.2",
+    "@antv/l7-source": "2.24.2",
+    "@antv/l7-core": "2.24.2",
+    "@antv/l7-utils": "2.24.2"
   },
   "devDependencies": {
     "@types/earcut": "^2.1.0",
     "@types/gl-matrix": "^2.4.5",
-    "@antv/l7-test-utils": "^2.24.0"
+    "@antv/l7-test-utils": "^2.24.2"
   },
   "publishConfig": {
     "access": "public",