@antv/l7-component 2.23.0 → 2.23.1

package/es/popup/layerPopup.d.ts

@@ -17,7 +17,7 @@ export type LayerPopupConfigItem = {
 export interface ILayerPopupOption extends IPopupOption {
     config?: LayerPopupConfigItem[];
     items?: LayerPopupConfigItem[];
-    trigger: 'hover' | 'click';
+    trigger: 'hover' | 'click' | 'touchend' | 'touchstart';
 }
 type LayerMapInfo = {
     onMouseMove?: (layer: ILayer, e: any) => void;
@@ -45,6 +45,12 @@ export default class LayerPopup extends Popup<ILayerPopupOption> {
         featureId: number;
     };
     protected get layerConfigItems(): LayerPopupConfigItem[];
+    /**
+     * 根据环境获取实际的触发事件
+     * 当 trigger 为 'click' 时，移动端使用 'touchend'，PC 端使用 'click'
+     * @protected
+     */
+    protected getActualTriggerEvent(): "hover" | "click" | "touchstart" | "touchend";
     addTo(scene: L7Container): this;
     remove(): this;
     setOptions(option: Partial<ILayerPopupOption>): this;
@@ -60,7 +66,7 @@ export default class LayerPopup extends Popup<ILayerPopupOption> {
      */
     protected unbindLayerEvent(): void;
     protected onLayerMouseMove(layer: ILayer, e: any): void;
-    protected onLayerMouseOut(layer: ILayer, e: any): void;
+    protected onLayerMouseOut(layer: ILayer): void;
     protected onLayerClick: (layer: ILayer, e: any) => void;
     protected onSceneClick: () => void;
     protected onSourceUpdate(): void;

package/es/popup/layerPopup.js

@@ -1,6 +1,6 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { DOM, lodashUtil } from '@antv/l7-utils';
+import { DOM, isPC, lodashUtil } from '@antv/l7-utils';
 import Popup from "./popup";
 const {
   get
@@ -72,6 +72,21 @@ export default class LayerPopup extends Popup {
     } = this.popupOption;
     return (_ref = config !== null && config !== void 0 ? config : items) !== null && _ref !== void 0 ? _ref : [];
   }
+
+  /**
+   * 根据环境获取实际的触发事件
+   * 当 trigger 为 'click' 时，移动端使用 'touchend'，PC 端使用 'click'
+   * @protected
+   */
+  getActualTriggerEvent() {
+    const {
+      trigger
+    } = this.popupOption;
+    if (trigger === 'click') {
+      return isPC() ? 'click' : 'touchend';
+    }
+    return trigger;
+  }
   addTo(scene) {
     super.addTo(scene);
     this.bindLayerEvent();
@@ -99,7 +114,7 @@ export default class LayerPopup extends Popup {
     return this;
   }
   getDefault(option) {
-    const isHoverTrigger = option.trigger !== 'click';
+    const isHoverTrigger = option.trigger === 'hover';
     return _objectSpread(_objectSpread({}, super.getDefault(option)), {}, {
       trigger: 'hover',
       followCursor: isHoverTrigger,
@@ -124,6 +139,7 @@ export default class LayerPopup extends Popup {
       trigger,
       closeOnClick
     } = this.popupOption;
+    const actualTrigger = this.getActualTriggerEvent();
     this.layerConfigItems.forEach(configItem => {
       var _layer$getSource;
       const layer = this.getLayerByConfig(configItem);
@@ -142,10 +158,10 @@ export default class LayerPopup extends Popup {
         var _this$mapsService;
         const onLayerClick = this.onLayerClick.bind(this, layer);
         layerInfo.onClick = onLayerClick;
-        layer === null || layer === void 0 || layer.on('click', onLayerClick);
+        layer === null || layer === void 0 || layer.on(actualTrigger, onLayerClick);
         const mapContainer = (_this$mapsService = this.mapsService) === null || _this$mapsService === void 0 ? void 0 : _this$mapsService.getMapContainer();
         if (mapContainer && closeOnClick) {
-          mapContainer.addEventListener('click', this.onSceneClick);
+          mapContainer.addEventListener(actualTrigger, this.onSceneClick);
         }
       }
       const source = layer === null || layer === void 0 || (_layer$getSource = layer.getSource) === null || _layer$getSource === void 0 ? void 0 : _layer$getSource.call(layer);
@@ -161,6 +177,7 @@ export default class LayerPopup extends Popup {
    * @protected
    */
   unbindLayerEvent() {
+    const actualTrigger = this.getActualTriggerEvent();
     this.layerConfigItems.forEach(configItem => {
       var _this$mapsService2;
       const layer = this.getLayerByConfig(configItem);
@@ -181,7 +198,7 @@ export default class LayerPopup extends Popup {
         layer.off('mouseout', onMouseOut);
       }
       if (onClick) {
-        layer.off('click', onClick);
+        layer.off(actualTrigger, onClick);
       }
       if (onSourceUpdate) {
         var _layer$getSource2;
@@ -189,7 +206,7 @@ export default class LayerPopup extends Popup {
       }
       const mapContainer = (_this$mapsService2 = this.mapsService) === null || _this$mapsService2 === void 0 ? void 0 : _this$mapsService2.getMapContainer();
       if (mapContainer) {
-        mapContainer.removeEventListener('click', this.onSceneClick);
+        mapContainer.removeEventListener(actualTrigger, this.onSceneClick);
       }
     });
   }
@@ -208,9 +225,7 @@ export default class LayerPopup extends Popup {
       this.show();
     }
   }
-
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  onLayerMouseOut(layer, e) {
+  onLayerMouseOut(layer) {
     this.setDisplayFeatureInfo(undefined);
     if (this.isShow) {
       this.hide();

package/es/popup/popup.js

@@ -436,7 +436,6 @@ export default class Popup extends EventEmitter {
   isOpen() {
     return !!this.mapsService;
   }
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   getDefault(option) {
     // tslint:disable-next-line:no-object-literal-type-assertion
     return {

package/lib/control/layerSwitch.js

@@ -129,7 +129,11 @@ class LayerSwitch extends _selectControl.default {
   // 如果是单选模式，则只显示第一个图层
   handleSingleSelection() {
     this.layers.forEach((layer, index) => {
-      index === 0 ? layer.show() : layer.hide();
+      if (index === 0) {
+        layer.show();
+      } else {
+        layer.hide();
+      }
     });
   }
   onAdd() {