From e99ea7d8b35f03a1ed7458355e9a01de2f5cf797 Mon Sep 17 00:00:00 2001
From: 2912401452 <2912401452@qq.com>
Date: Thu, 16 Sep 2021 17:35:02 +0800
Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E7=82=B9?=
 =?UTF-8?q?=E5=87=BB=E5=86=B2=E7=AA=81=E6=A3=80=E6=B5=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../services/interaction/PickingService.ts    | 26 ++-----------
 packages/core/src/utils/dom.ts                | 19 ++++++++++
 stories/Components/components/Scale.tsx       | 37 ++++++++++++++++---
 stories/District/Layer/province.tsx           | 10 +++--
 stories/Picking/components/Tooltip.tsx        |  1 +
 5 files changed, 62 insertions(+), 31 deletions(-)

diff --git a/packages/core/src/services/interaction/PickingService.ts b/packages/core/src/services/interaction/PickingService.ts
index d4a7b13110..3e845a0fb2 100644
--- a/packages/core/src/services/interaction/PickingService.ts
+++ b/packages/core/src/services/interaction/PickingService.ts
@@ -14,6 +14,7 @@ import { gl } from '../renderer/gl';
 import { IFramebuffer } from '../renderer/IFramebuffer';
 import { IRendererService } from '../renderer/IRendererService';
 import { IPickingService } from './IPickingService';
+import { isEventCrash } from '../../utils/dom'
 
 @injectable()
 export default class PickingService implements IPickingService {
@@ -321,28 +322,9 @@ export default class PickingService implements IPickingService {
   ) {
     layer.emit(target.type, target);
     // 判断是否发生事件冲突
-    // if (this.isEventCrash(target)) {
-    //   layer.emit(target.type, target);
-    // }
-  }
-
-  /**
-   * 检测触发事件是否是在 marker/popup 上发生，若是则会发生冲突（发生冲突时 marker/popup 事件优先）
-   * @param obj
-   * @returns
-   */
-  private isEventCrash(obj: any) {
-    let notCrash = true;
-    obj.target.path.map((p: HTMLElement) => {
-      if (p.classList) {
-        p.classList.forEach((n: any) => {
-          if (n === 'l7-marker' || n === 'l7-popup') {
-            notCrash = false;
-          }
-        });
-      }
-    });
-    return notCrash;
+    if (isEventCrash(target)) {
+      layer.emit(target.type, target);
+    }
   }
 
   /**
diff --git a/packages/core/src/utils/dom.ts b/packages/core/src/utils/dom.ts
index ef8ca5a6b1..4b51ab2b92 100644
--- a/packages/core/src/utils/dom.ts
+++ b/packages/core/src/utils/dom.ts
@@ -25,3 +25,22 @@ export function createRendererContainer(
 
   return null;
 }
+
+/**
+ * 检测触发事件是否是在 marker/popup 上发生，若是则会发生冲突（发生冲突时 marker/popup 事件优先）
+ * @param obj
+ * @returns
+ */
+export function isEventCrash(obj: any) {
+  let notCrash = true;
+  obj?.target?.path?.map((p: HTMLElement) => {
+    if (p?.classList) {
+      p?.classList?.forEach((n: any) => {
+        if (n === 'l7-marker' || n === 'l7-popup') {
+          notCrash = false;
+        }
+      });
+    }
+  });
+  return notCrash;
+}
\ No newline at end of file
diff --git a/stories/Components/components/Scale.tsx b/stories/Components/components/Scale.tsx
index 1f2061f41f..e031595435 100644
--- a/stories/Components/components/Scale.tsx
+++ b/stories/Components/components/Scale.tsx
@@ -81,7 +81,7 @@ export default class ScaleComponent extends React.Component {
     pointLayer.on('mouseout', (e) => {
       console.log(2, e);
     });
-    const scaleControl = new Scale();
+    // const scaleControl = new Scale();
     const layers = {
       点图层: pointLayer,
       面图层: layer,
@@ -91,12 +91,37 @@ export default class ScaleComponent extends React.Component {
       position: 'bottomright',
     });
 
-    scene.addControl(scaleControl);
+    // scene.addControl(scaleControl);
     scene.addControl(layerControl);
-    const zoomControl = new Zoom({
-      position: 'bottomright',
-    });
-    scene.addControl(zoomControl);
+    // const zoomControl = new Zoom({
+    //   position: 'bottomright',
+    // });
+    // scene.addControl(zoomControl);
+
+    setTimeout(() => {
+      const pointLayer3 = new PointLayer({
+        name: '02',
+        enablePropagation: true,
+      })
+        .source(pointsData, {
+          cluster: true,
+        })
+        .shape('circle')
+        .scale('point_count', {
+          type: 'quantile',
+        })
+        .size('point_count', [3])
+        .animate(false)
+        .active(false)
+        .color('red')
+        .style({
+          opacity: 0.5,
+          strokeWidth: 1,
+        });
+      scene.addLayer(pointLayer3);
+
+      layerControl.addVisualLayer(pointLayer3, 'pointLayer3')
+    }, 2000)
   }
 
   public render() {
diff --git a/stories/District/Layer/province.tsx b/stories/District/Layer/province.tsx
index 4a634fcce5..7ddb0da17e 100644
--- a/stories/District/Layer/province.tsx
+++ b/stories/District/Layer/province.tsx
@@ -219,7 +219,7 @@ export default class Country extends React.Component {
         data,
         geoDataLevel: 1,
         joinBy: ['adcode', 'code'],
-        adcode: [],
+        adcode: [province],
         stroke: '#7096B3',
         depth: 2,
         showBorder: false,
@@ -244,7 +244,7 @@ export default class Country extends React.Component {
     return (
       <>
         <Select
-          defaultValue="北京市"
+          defaultValue="黑龙江省"
           style={{
             width: 120,
             zIndex: 2,
@@ -252,7 +252,10 @@ export default class Country extends React.Component {
             right: '10px',
             top: '10px',
           }}
-          onChange={this.handleProvinceChange}
+          // onChange={this.handleProvinceChange}
+          onChange={() => {
+            console.log('change')
+          }}
         >
           {ProvinceData.map((province, i) => {
             return (
@@ -280,6 +283,7 @@ export default class Country extends React.Component {
     this.setState({
       province: value,
     });
+    console.log('value', value)
     this.provinceLayer.updateDistrict([value]);
   };
 }
diff --git a/stories/Picking/components/Tooltip.tsx b/stories/Picking/components/Tooltip.tsx
index 36956f6f6b..a82b633759 100644
--- a/stories/Picking/components/Tooltip.tsx
+++ b/stories/Picking/components/Tooltip.tsx
@@ -37,6 +37,7 @@ export default class Tooltip extends React.Component {
         '#CF1D49',
       ])
       .shape('fill')
+      .select(true)
       .style({
         opacity: 0.8,
       });

From e2a78cbc967e5bd0914674e2f7953fc732c3b4b5 Mon Sep 17 00:00:00 2001
From: 2912401452 <2912401452@qq.com>
Date: Thu, 16 Sep 2021 17:36:14 +0800
Subject: [PATCH 2/2] feat: test open layer initLayer update

---
 packages/component/src/control/layer.ts                  | 2 +-
 packages/core/src/services/interaction/PickingService.ts | 2 +-
 packages/core/src/utils/dom.ts                           | 2 +-
 stories/Components/components/Scale.tsx                  | 4 ++--
 stories/District/Layer/province.tsx                      | 4 ++--
 5 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/component/src/control/layer.ts b/packages/component/src/control/layer.ts
index 06169079f8..f921478f0f 100644
--- a/packages/component/src/control/layer.ts
+++ b/packages/component/src/control/layer.ts
@@ -135,7 +135,7 @@ export default class Layers extends Control {
       this.addLayer(baseLayers[name], name, false);
     });
     Object.keys(overlayers).forEach((name: any, index: number) => {
-      // overlayers[name].once('inited', this.update);
+      overlayers[name].once('inited', this.update);
       this.addLayer(overlayers[name], name, true);
     });
   }
diff --git a/packages/core/src/services/interaction/PickingService.ts b/packages/core/src/services/interaction/PickingService.ts
index 3e845a0fb2..03077af060 100644
--- a/packages/core/src/services/interaction/PickingService.ts
+++ b/packages/core/src/services/interaction/PickingService.ts
@@ -2,6 +2,7 @@ import { decodePickingColor, DOM, encodePickingColor } from '@antv/l7-utils';
 import { inject, injectable } from 'inversify';
 import 'reflect-metadata';
 import { TYPES } from '../../types';
+import { isEventCrash } from '../../utils/dom';
 import { IGlobalConfigService, ISceneConfig } from '../config/IConfigService';
 import {
   IInteractionService,
@@ -14,7 +15,6 @@ import { gl } from '../renderer/gl';
 import { IFramebuffer } from '../renderer/IFramebuffer';
 import { IRendererService } from '../renderer/IRendererService';
 import { IPickingService } from './IPickingService';
-import { isEventCrash } from '../../utils/dom'
 
 @injectable()
 export default class PickingService implements IPickingService {
diff --git a/packages/core/src/utils/dom.ts b/packages/core/src/utils/dom.ts
index 4b51ab2b92..bfbdcd0194 100644
--- a/packages/core/src/utils/dom.ts
+++ b/packages/core/src/utils/dom.ts
@@ -43,4 +43,4 @@ export function isEventCrash(obj: any) {
     }
   });
   return notCrash;
-}
\ No newline at end of file
+}
diff --git a/stories/Components/components/Scale.tsx b/stories/Components/components/Scale.tsx
index e031595435..615aa97ff2 100644
--- a/stories/Components/components/Scale.tsx
+++ b/stories/Components/components/Scale.tsx
@@ -120,8 +120,8 @@ export default class ScaleComponent extends React.Component {
         });
       scene.addLayer(pointLayer3);
 
-      layerControl.addVisualLayer(pointLayer3, 'pointLayer3')
-    }, 2000)
+      layerControl.addVisualLayer(pointLayer3, 'pointLayer3');
+    }, 2000);
   }
 
   public render() {
diff --git a/stories/District/Layer/province.tsx b/stories/District/Layer/province.tsx
index 7ddb0da17e..1226a0d852 100644
--- a/stories/District/Layer/province.tsx
+++ b/stories/District/Layer/province.tsx
@@ -254,7 +254,7 @@ export default class Country extends React.Component {
           }}
           // onChange={this.handleProvinceChange}
           onChange={() => {
-            console.log('change')
+            console.log('change');
           }}
         >
           {ProvinceData.map((province, i) => {
@@ -283,7 +283,7 @@ export default class Country extends React.Component {
     this.setState({
       province: value,
     });
-    console.log('value', value)
+    console.log('value', value);
     this.provinceLayer.updateDistrict([value]);
   };
 }