@antv/l7-component 2.15.1 → 2.15.3

package/lib/popup/layerPopup.js

@@ -1,67 +1,44 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.LayerPopup = void 0;
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
 var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
 var _get2 = _interopRequireDefault(require("@babel/runtime/helpers/get"));
-
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _l7Utils = require("@antv/l7-utils");
-
 var _lodash = require("lodash");
-
 var _popup = _interopRequireDefault(require("./popup"));
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 var LayerPopup = /*#__PURE__*/function (_Popup) {
   (0, _inherits2.default)(LayerPopup, _Popup);
-
   var _super = _createSuper(LayerPopup);
-
   function LayerPopup() {
     var _this;
-
     (0, _classCallCheck2.default)(this, LayerPopup);
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _super.call.apply(_super, [this].concat(args));
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "layerConfigMap", new WeakMap());
     return _this;
   }
-
   (0, _createClass2.default)(LayerPopup, [{
     key: "layerConfigItems",
     get: function get() {
       var _ref;
-
       var _this$popupOption = this.popupOption,
-          config = _this$popupOption.config,
-          items = _this$popupOption.items;
+        config = _this$popupOption.config,
+        items = _this$popupOption.items;
       return (_ref = config !== null && config !== void 0 ? config : items) !== null && _ref !== void 0 ? _ref : [];
     }
   }, {
@@ -105,93 +82,72 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
         closeOnEsc: false
       });
     }
+
     /**
      * 绑定对应的图层事件
      * @protected
      */
-
   }, {
     key: "bindLayerEvent",
     value: function bindLayerEvent() {
       var _this2 = this;
-
       var trigger = this.popupOption.trigger;
       this.layerConfigItems.forEach(function (configItem) {
         var _layer$getSource;
-
         var layer = _this2.getLayerByConfig(configItem);
-
         if (!layer) {
           return;
         }
-
         var layerInfo = (0, _objectSpread2.default)({}, configItem);
-
         if (trigger === 'hover') {
           var onMouseMove = _this2.onLayerMouseMove.bind(_this2, layer);
-
           var onMouseOut = _this2.onLayerMouseOut.bind(_this2, layer);
-
           layerInfo.onMouseMove = onMouseMove;
           layerInfo.onMouseOut = onMouseOut;
           layer === null || layer === void 0 ? void 0 : layer.on('mousemove', onMouseMove);
           layer === null || layer === void 0 ? void 0 : layer.on('mouseout', onMouseOut);
         } else {
           var onClick = _this2.onLayerClick.bind(_this2, layer);
-
           layerInfo.onClick = onClick;
           layer === null || layer === void 0 ? void 0 : layer.on('click', onClick);
         }
-
         var source = layer === null || layer === void 0 ? void 0 : (_layer$getSource = layer.getSource) === null || _layer$getSource === void 0 ? void 0 : _layer$getSource.call(layer);
-
         var onSourceUpdate = _this2.onSourceUpdate.bind(_this2, layer);
-
         source === null || source === void 0 ? void 0 : source.on('update', onSourceUpdate);
         layerInfo.onSourceUpdate = onSourceUpdate;
-
         _this2.layerConfigMap.set(layer, layerInfo);
       });
     }
+
     /**
      * 解绑对应的图层事件
      * @protected
      */
-
   }, {
     key: "unbindLayerEvent",
     value: function unbindLayerEvent() {
       var _this3 = this;
-
       this.layerConfigItems.forEach(function (configItem) {
         var layer = _this3.getLayerByConfig(configItem);
-
         var layerInfo = layer && _this3.layerConfigMap.get(layer);
-
         if (!layerInfo) {
           return;
         }
-
         var onMouseMove = layerInfo.onMouseMove,
-            onMouseOut = layerInfo.onMouseOut,
-            onClick = layerInfo.onClick,
-            onSourceUpdate = layerInfo.onSourceUpdate;
-
+          onMouseOut = layerInfo.onMouseOut,
+          onClick = layerInfo.onClick,
+          onSourceUpdate = layerInfo.onSourceUpdate;
         if (onMouseMove) {
           layer.off('mousemove', onMouseMove);
         }
-
         if (onMouseOut) {
           layer.off('mouseout', onMouseOut);
         }
-
         if (onClick) {
           layer.off('click', onClick);
         }
-
         if (onSourceUpdate) {
           var _layer$getSource2;
-
           layer === null || layer === void 0 ? void 0 : (_layer$getSource2 = layer.getSource()) === null || _layer$getSource2 === void 0 ? void 0 : _layer$getSource2.off('update', onSourceUpdate);
         }
       });
@@ -201,9 +157,8 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
     value: function onLayerMouseMove(layer, e) {
       if (!this.isSameFeature(layer, e.featureId)) {
         var _this$getLayerInfoFra = this.getLayerInfoFrag(layer, e),
-            title = _this$getLayerInfoFra.title,
-            content = _this$getLayerInfoFra.content;
-
+          title = _this$getLayerInfoFra.title,
+          content = _this$getLayerInfoFra.content;
         this.setDOMContent(content);
         this.setTitle(title);
         this.displayFeatureInfo = {
@@ -212,13 +167,13 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
         };
         this.show();
       }
-    } // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    }
 
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
   }, {
     key: "onLayerMouseOut",
     value: function onLayerMouseOut(layer, e) {
       this.displayFeatureInfo = undefined;
-
       if (this.isShow) {
         this.hide();
       }
@@ -230,9 +185,8 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
         this.hide();
       } else {
         var _this$getLayerInfoFra2 = this.getLayerInfoFrag(layer, e),
-            title = _this$getLayerInfoFra2.title,
-            content = _this$getLayerInfoFra2.content;
-
+          title = _this$getLayerInfoFra2.title,
+          content = _this$getLayerInfoFra2.content;
         this.setDOMContent(content);
         this.setLnglat(e.lngLat);
         this.setTitle(title);
@@ -249,70 +203,57 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
       this.hide();
       this.displayFeatureInfo = undefined;
     }
+
     /**
      * 通过当前图层和对应选中的元素获取气泡展示的 HTML 内容
      * @param layer
      * @param e
      * @protected
      */
-
   }, {
     key: "getLayerInfoFrag",
     value: function getLayerInfoFrag(layer, e) {
       var layerInfo = this.layerConfigMap.get(layer);
       var titleFrag;
       var contentFrag = document.createDocumentFragment();
-
       if (layerInfo) {
         var _feature = e.feature;
-
         if (_feature.type === 'Feature' && 'properties' in _feature && 'geometry' in _feature) {
           _feature = _feature.properties;
         }
-
         var title = layerInfo.title,
-            fields = layerInfo.fields,
-            customContent = layerInfo.customContent;
-
+          fields = layerInfo.fields,
+          customContent = layerInfo.customContent;
         if (title) {
           titleFrag = document.createDocumentFragment();
           var titleElement = title instanceof Function ? title(_feature) : title;
-
           _l7Utils.DOM.appendElementType(titleFrag, titleElement);
         }
-
         if (customContent) {
           var content = customContent instanceof Function ? customContent(_feature) : customContent;
-
           _l7Utils.DOM.appendElementType(contentFrag, content);
         } else if (fields !== null && fields !== void 0 && fields.length) {
           fields === null || fields === void 0 ? void 0 : fields.forEach(function (fieldConfig) {
             var _ref3, _ref4;
-
-            var _ref2 = typeof fieldConfig === 'string' ? // tslint:disable-next-line:no-object-literal-type-assertion
-            {
-              field: fieldConfig
-            } : fieldConfig,
-                field = _ref2.field,
-                formatField = _ref2.formatField,
-                formatValue = _ref2.formatValue,
-                getValue = _ref2.getValue;
-
+            var _ref2 = typeof fieldConfig === 'string' ?
+              // tslint:disable-next-line:no-object-literal-type-assertion
+              {
+                field: fieldConfig
+              } : fieldConfig,
+              field = _ref2.field,
+              formatField = _ref2.formatField,
+              formatValue = _ref2.formatValue,
+              getValue = _ref2.getValue;
             var row = _l7Utils.DOM.create('div', 'l7-layer-popup__row');
-
             var value = getValue ? getValue(e.feature) : (0, _lodash.get)(_feature, field);
             var fieldElement = (_ref3 = formatField instanceof Function ? formatField(field, _feature) : formatField) !== null && _ref3 !== void 0 ? _ref3 : field;
             var valueElement = (_ref4 = formatValue instanceof Function ? formatValue(value, _feature) : formatValue) !== null && _ref4 !== void 0 ? _ref4 : value;
-
             var fieldSpan = _l7Utils.DOM.create('span', 'l7-layer-popup__key', row);
-
             _l7Utils.DOM.appendElementType(fieldSpan, fieldElement);
-
             _l7Utils.DOM.appendElementType(fieldSpan, document.createTextNode('：'));
+            var valueSpan = _l7Utils.DOM.create('span', 'l7-layer-popup__value', row);
 
-            var valueSpan = _l7Utils.DOM.create('span', 'l7-layer-popup__value', row); // 当 value 中每项元素均为基础数据类型时，用逗号隔开
-
-
+            // 当 value 中每项元素均为基础数据类型时，用逗号隔开
             if (Array.isArray(valueElement) && valueElement.every(function (item) {
               return !(item instanceof Object);
             })) {
@@ -320,45 +261,40 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
                 return String(item);
               }).join(',');
             }
-
             _l7Utils.DOM.appendElementType(valueSpan, valueElement);
-
             contentFrag.appendChild(row);
           });
         }
       }
-
       return {
         title: titleFrag,
         content: contentFrag
       };
     }
+
     /**
      * 通过 Layer 配置访问到真实的 Layer 实例
      * @param configItem
      * @protected
      */
-
   }, {
     key: "getLayerByConfig",
     value: function getLayerByConfig(configItem) {
       var layer = configItem.layer;
-
       if (layer instanceof Object) {
         return layer;
       }
-
       if (typeof layer === 'string') {
         return this.layerService.getLayer(layer) || this.layerService.getLayerByName(layer);
       }
     }
+
     /**
      * 判断当前展示的 Feature 是否和上一次查看的一致
      * @param layer
      * @param featureId
      * @protected
      */
-
   }, {
     key: "isSameFeature",
     value: function isSameFeature(layer, featureId) {
@@ -368,5 +304,4 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
   }]);
   return LayerPopup;
 }(_popup.default);
-
 exports.default = exports.LayerPopup = LayerPopup;