From a6ab68a12e692930e3bc11b30469e69fcf22f138 Mon Sep 17 00:00:00 2001
From: YiQianYao <42212176+2912401452@users.noreply.github.com>
Date: Wed, 11 May 2022 10:05:35 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E6=8B=BE=E5=8F=96?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81=E6=AE=8B=E7=95=99=E5=AF=BC=E8=87=B4=E7=9A=84?=
 =?UTF-8?q?=E6=8B=BE=E5=8F=96=E9=AB=98=E4=BA=AE=E9=94=99=E8=AF=AF=20(#1105?=
 =?UTF-8?q?)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix: clear last pick state before pick

* style: lint style
---
 .../services/interaction/PickingService.ts    | 11 +++++
 stories/Map/components/amap2demo_polygon.tsx  | 44 +++++++++++++++----
 2 files changed, 46 insertions(+), 9 deletions(-)

diff --git a/packages/core/src/services/interaction/PickingService.ts b/packages/core/src/services/interaction/PickingService.ts
index 146b6dd61b..927e923a0a 100644
--- a/packages/core/src/services/interaction/PickingService.ts
+++ b/packages/core/src/services/interaction/PickingService.ts
@@ -48,6 +48,9 @@ export default class PickingService implements IPickingService {
 
   private lastPickTime: number = new Date().getTime();
 
+  // Tip: 记录当前拾取中的 layers
+  private pickedLayers: ILayer[] = [];
+
   public init(id: string) {
     const {
       createTexture2D,
@@ -274,6 +277,12 @@ export default class PickingService implements IPickingService {
 
           layer.renderModels(true);
           layer.hooks.afterPickingEncode.call();
+
+          // Tip: clear last picked layer state
+          this.pickedLayers.map((pickedlayer) => {
+            this.selectFeature(pickedlayer, new Uint8Array([0, 0, 0, 0]));
+          });
+
           const isPicked = this.pickFromPickingFBO(layer, target);
           this.layerService.pickedLayerId = isPicked ? +layer.id : -1;
 
@@ -355,6 +364,7 @@ export default class PickingService implements IPickingService {
         // trigger onHover/Click callback on layer
         isPicked = true;
         layer.setCurrentPickId(pickedFeatureIdx);
+        this.pickedLayers = [layer];
         this.triggerHoverOnLayer(layer, layerTarget); // 触发拾取事件
       }
     } else {
@@ -377,6 +387,7 @@ export default class PickingService implements IPickingService {
       });
       this.triggerHoverOnLayer(layer, layerTarget);
       layer.setCurrentPickId(null);
+      this.pickedLayers = [];
     }
 
     if (enableHighlight) {
diff --git a/stories/Map/components/amap2demo_polygon.tsx b/stories/Map/components/amap2demo_polygon.tsx
index b9602570ad..afa10121be 100644
--- a/stories/Map/components/amap2demo_polygon.tsx
+++ b/stories/Map/components/amap2demo_polygon.tsx
@@ -13,7 +13,7 @@ export default class Amap2demo_polygon extends React.Component {
   public async componentDidMount() {
     const scene = new Scene({
       id: 'map',
-      map: new GaodeMapV2({
+      map: new GaodeMap({
         pitch: 40,
         center: [120, 30],
         zoom: 13,
@@ -44,33 +44,59 @@ export default class Amap2demo_polygon extends React.Component {
       ],
     };
 
+    const data2 = {
+      type: 'FeatureCollection',
+      features: [
+        {
+          type: 'Feature',
+          properties: {
+            testOpacity: 0.8,
+          },
+          geometry: {
+            type: 'Polygon',
+            coordinates: [
+              [
+                [113.8623046875 + 1, 30.031055426540206],
+                [116.3232421875 + 1, 30.031055426540206],
+                [116.3232421875 + 1, 31.090574094954192],
+                [113.8623046875 + 1, 31.090574094954192],
+                [113.8623046875 + 1, 30.031055426540206],
+              ],
+            ],
+          },
+        },
+      ],
+    };
+
     const layer = new PolygonLayer({
       autoFit: true,
     })
       .source(data)
       .shape('fill')
       .color('red')
+      .active(true)
       .style({
-        opacityLinear: {
-          enable: true,
-          dir: 'in',
-        },
+        // opacityLinear: {
+        //   enable: true,
+        //   dir: 'in',
+        // },
       });
     scene.addLayer(layer);
 
     const layer2 = new PolygonLayer({
       autoFit: true,
     })
-      .source(data)
+      .source(data2)
       .shape('fill')
-      .color('red')
+      .color('#ff0')
+      .active(true)
       .style({
-        opacity: 0.4,
+        // opacity: 0.4,
         // opacityLinear: {
         //   enable: true,
         //   dir: 'out',
         // },
-        raisingHeight: 50000,
+        // raisingHeight: 50000,
       });
     scene.addLayer(layer2);
   }