fix: mvt tile pick fix #2273

antvis · Feb 20, 2024 · 7a16166 · 7a16166
1 parent c9551aa
commit 7a16166
Show file tree

Hide file tree

Showing 7 changed files with 15 additions and 18 deletions.
diff --git a/examples/demos/tile/perf.ts b/examples/demos/tile/perf.ts
@@ -2,8 +2,6 @@ import { LineLayer, PolygonLayer, Scene, Source } from '@antv/l7';
 // @ts-ignore
 import * as allMap from '@antv/l7-maps';
 import { Protocol } from 'pmtiles';
-const protocol = new Protocol();
-Scene.addProtocol('pmtiles', protocol.tile);
 
 export function MapRender(option: {
   map: string;
@@ -41,11 +39,17 @@ export function MapRender(option: {
     // 绿地
     const fill = new PolygonLayer({
       sourceLayer: 'CHN_Districts',
+      featureId:'adcode',
     })
       .source(source)
       .shape('fill')
+      // .color('#f00');
       .color('adcode', getColorByAdcode);
 
+    fill.on('click', (e) => {
+      console.log(e);
+    });
+
     const line = new LineLayer({
       sourceLayer: 'CHN_Districts_L',
     })
@@ -70,9 +74,9 @@ export function MapRender(option: {
       .color('#de2d26');
 
     scene.addLayer(fill);
-    scene.addLayer(line);
-    scene.addLayer(line2);
-    scene.addLayer(line3);
+    // scene.addLayer(line);
+    // scene.addLayer(line2);
+    // scene.addLayer(line3);
     //   scene.addLayer(line2);
     // const debugerLayer = new TileDebugLayer({ usage: 'basemap' });
     // scene.addLayer(debugerLayer);

diff --git a/packages/core/src/services/interaction/PickingService.ts b/packages/core/src/services/interaction/PickingService.ts
@@ -376,23 +376,16 @@ export default class PickingService implements IPickingService {
     for (const layer of layers
       .filter((layer) => layer.needPick(target.type))
       .reverse()) {
-      if (!layer.tileLayer) {
-        layer.hooks.beforePickingEncode.call();
-      }
       await useFramebufferAsync(this.pickingFBO, async () => {
         clear({
           framebuffer: this.pickingFBO,
           color: [0, 0, 0, 0],
           stencil: 0,
           depth: 1,
         });
+        // 渲染需要拾取的图层
         layer.layerPickService.pickRender(target);
       });
-
-      if (!layer.tileLayer) {
-        layer.hooks.afterPickingEncode.call();
-      }
-
       const isPicked = await this.pickFromPickingFBO(layer, target);
       this.layerService.pickedLayerId = isPicked ? +layer.id : -1;
       if (isPicked && !layer.getLayerConfig().enablePropagation) {

diff --git a/packages/core/src/services/layer/LayerService.ts b/packages/core/src/services/layer/LayerService.ts
@@ -189,7 +189,7 @@ export default class LayerService
   public renderTileLayerMask(layer: ILayer) {
     let maskindex = 0;
     const { enableMask = true } = layer.getLayerConfig();
-    let maskCount = layer.tileMask ? 1 : 0;
+    let maskCount = layer.tileMask ? 1 : 0; // 瓦片裁剪 线图层或者面图层
     const masklayers = layer.masks.filter((m) => m.inited);
 
     maskCount = maskCount + (enableMask ? masklayers.length : 1);

diff --git a/packages/layers/src/core/BaseLayer.ts b/packages/layers/src/core/BaseLayer.ts
@@ -1404,7 +1404,6 @@ export default class BaseLayer<ChildLayerStyleOptions = {}>
       this.clearModels();
       return this;
     }
-
     this.hooks.beforeRender.call();
     this.models.forEach((model) => {
       model.draw(

diff --git a/packages/layers/src/core/LayerPickService.ts b/packages/layers/src/core/LayerPickService.ts
@@ -21,10 +21,13 @@ export default class BaseLayerPickService implements ILayerPickService {
     if (layer.tileLayer) {
       return layer.tileLayer.pickRender(target);
     }
+    // 渲染瓦片图层的拾取
+    layer.hooks.beforePickingEncode.call();
     layerService.renderTileLayerMask(layer);
     layer.renderModels({
       ispick: true,
     });
+    layer.hooks.afterPickingEncode.call();
   }
 
   public async pick(layer: ILayer, target: IInteractionTarget) {

diff --git a/packages/source/src/parser/geojson.ts b/packages/source/src/parser/geojson.ts
@@ -37,7 +37,7 @@ function getFeatureID(feature: Feature<Geometries, Properties>, key?: string) {
   }
 
   // @ts-ignore
-  if (typeof feature.properties[key] * 1 === 'number') {
+  if (typeof (feature.properties[key] * 1) === 'number') {
     // @ts-ignore
     return feature.properties[key] * 1;
   }
@@ -90,7 +90,6 @@ export default function geoJSON(
       if (featureId === null) {
         featureId = featureIndex;
       }
-
       const sortedID = featureId;
 
       const coord = getCoords(currentFeature);

diff --git a/packages/source/src/source/vector.ts b/packages/source/src/source/vector.ts
@@ -42,7 +42,6 @@ export default class VectorSource implements ITileSource {
     for (let i = 0; i < vectorTile.length; i++) {
       const vectorTileFeature = vectorTile.feature(i);
       const feature = vectorTileFeature.toGeoJSON(this.x, this.y, this.z);
-
       features.push({
         ...feature,
         properties: {