@antv/l7-component 2.16.1 → 2.16.2

package/es/popup/popup.js

@@ -6,103 +6,76 @@ import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(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; } }
-
 import { TYPES } from '@antv/l7-core';
 import { anchorTranslate, anchorType, applyAnchorClass, DOM } from '@antv/l7-utils';
 import { EventEmitter } from 'eventemitter3';
 import { createL7Icon } from "../utils/icon";
 export { Popup };
-
 var Popup = /*#__PURE__*/function (_EventEmitter) {
   _inherits(Popup, _EventEmitter);
-
   var _super = _createSuper(Popup);
-
   function Popup(cfg) {
     var _this;
-
     _classCallCheck(this, Popup);
-
     _this = _super.call(this);
-
     _defineProperty(_assertThisInitialized(_this), "isShow", true);
-
     _defineProperty(_assertThisInitialized(_this), "onMouseMove", function (e) {
       var _container$getBoundin;
-
       var container = _this.mapsService.getMapContainer();
-
       var _ref = (_container$getBoundin = container === null || container === void 0 ? void 0 : container.getBoundingClientRect()) !== null && _container$getBoundin !== void 0 ? _container$getBoundin : {},
-          _ref$left = _ref.left,
-          left = _ref$left === void 0 ? 0 : _ref$left,
-          _ref$top = _ref.top,
-          top = _ref$top === void 0 ? 0 : _ref$top;
-
+        _ref$left = _ref.left,
+        left = _ref$left === void 0 ? 0 : _ref$left,
+        _ref$top = _ref.top,
+        top = _ref$top === void 0 ? 0 : _ref$top;
       _this.setPopupPosition(e.clientX - left, e.clientY - top);
     });
-
     _defineProperty(_assertThisInitialized(_this), "updateLngLatPosition", function () {
       if (!_this.mapsService || _this.popupOption.followCursor) {
         return;
       }
-
       var _this$lngLat = _this.lngLat,
-          lng = _this$lngLat.lng,
-          lat = _this$lngLat.lat;
-
+        lng = _this$lngLat.lng,
+        lat = _this$lngLat.lat;
       var _this$mapsService$lng = _this.mapsService.lngLatToContainer([lng, lat]),
-          x = _this$mapsService$lng.x,
-          y = _this$mapsService$lng.y;
-
+        x = _this$mapsService$lng.x,
+        y = _this$mapsService$lng.y;
       _this.setPopupPosition(x, y);
     });
-
     _defineProperty(_assertThisInitialized(_this), "onKeyDown", function (e) {
       if (e.keyCode === 27) {
         _this.remove();
       }
     });
-
     _defineProperty(_assertThisInitialized(_this), "onCloseButtonClick", function (e) {
       if (e.stopPropagation) {
         e.stopPropagation();
       }
-
       _this.hide();
     });
-
     _defineProperty(_assertThisInitialized(_this), "update", function () {
       var hasPosition = !!_this.lngLat;
       var _this$popupOption = _this.popupOption,
-          className = _this$popupOption.className,
-          style = _this$popupOption.style,
-          maxWidth = _this$popupOption.maxWidth,
-          anchor = _this$popupOption.anchor,
-          stopPropagation = _this$popupOption.stopPropagation;
-
+        className = _this$popupOption.className,
+        style = _this$popupOption.style,
+        maxWidth = _this$popupOption.maxWidth,
+        anchor = _this$popupOption.anchor,
+        stopPropagation = _this$popupOption.stopPropagation;
       if (!_this.mapsService || !hasPosition || !_this.content) {
         return;
       }
-
-      var popupContainer = _this.mapsService.getMarkerContainer(); // 如果当前没有创建 Popup 容器则创建
-
-
+      var popupContainer = _this.mapsService.getMarkerContainer();
+      // 如果当前没有创建 Popup 容器则创建
       if (!_this.container && popupContainer) {
         _this.container = DOM.create('div', "l7-popup ".concat(className !== null && className !== void 0 ? className : '', " ").concat(!_this.isShow ? 'l7-popup-hide' : ''), popupContainer);
-
         if (style) {
           _this.container.setAttribute('style', style);
         }
-
         _this.tip = DOM.create('div', 'l7-popup-tip', _this.container);
+        _this.container.appendChild(_this.content);
 
-        _this.container.appendChild(_this.content); // 高德地图需要阻止事件冒泡 // 测试mapbox 地图不需要添加
-
-
+        // 高德地图需要阻止事件冒泡 // 测试mapbox 地图不需要添加
         if (stopPropagation) {
           ['mousemove', 'mousedown', 'mouseup', 'click', 'dblclick'].forEach(function (type) {
             _this.container.addEventListener(type, function (e) {
@@ -110,19 +83,14 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
             });
           });
         }
-
         _this.container.style.whiteSpace = 'nowrap';
       }
-
       _this.updateLngLatPosition();
-
       DOM.setTransform(_this.container, "".concat(anchorTranslate[anchor]));
       applyAnchorClass(_this.container, anchor, 'popup');
-
       if (maxWidth) {
         var _this$container$getBo = _this.container.getBoundingClientRect(),
-            width = _this$container$getBo.width;
-
+          width = _this$container$getBo.width;
         if (width > parseFloat(maxWidth)) {
           _this.container.style.width = maxWidth;
         }
@@ -130,17 +98,13 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
         _this.container.style.removeProperty('width');
       }
     });
-
     _this.popupOption = _objectSpread(_objectSpread({}, _this.getDefault(cfg !== null && cfg !== void 0 ? cfg : {})), cfg);
     var lngLat = _this.popupOption.lngLat;
-
     if (lngLat) {
       _this.lngLat = lngLat;
     }
-
     return _this;
   }
-
   _createClass(Popup, [{
     key: "lngLat",
     get:
@@ -183,9 +147,9 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
      * 当前是否展示
      * @protected
      */
+
     function get() {
       var _this$popupOption$lng;
-
       return (_this$popupOption$lng = this.popupOption.lngLat) !== null && _this$popupOption$lng !== void 0 ? _this$popupOption$lng : {
         lng: 0,
         lat: 0
@@ -208,65 +172,59 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
       this.mapsService.on('camerachange', this.update);
       this.mapsService.on('viewchange', this.update);
       this.scene = scene;
-      this.update(); // 临时关闭
-
+      this.update();
+      // 临时关闭
       this.updateCloseOnClick();
       this.updateCloseOnEsc();
       this.updateFollowCursor();
       var _this$popupOption2 = this.popupOption,
-          html = _this$popupOption2.html,
-          text = _this$popupOption2.text,
-          title = _this$popupOption2.title;
-
+        html = _this$popupOption2.html,
+        text = _this$popupOption2.text,
+        title = _this$popupOption2.title;
       if (html) {
         this.setHTML(html);
       } else if (text) {
         this.setText(text);
       }
-
       if (title) {
         this.setTitle(title);
       }
-
       this.emit('open');
       return this;
-    } // 移除popup
+    }
 
+    // 移除popup
   }, {
     key: "remove",
     value: function remove() {
       if (!(this !== null && this !== void 0 && this.isOpen())) {
         return;
       }
-
       if (this.content) {
         DOM.remove(this.content);
       }
-
       if (this.container) {
-        DOM.remove(this.container); // @ts-ignore
-
+        DOM.remove(this.container);
+        // @ts-ignore
         delete this.container;
       }
-
       if (this.mapsService) {
         // TODO: mapbox AMap 事件同步
         this.mapsService.off('camerachange', this.update);
         this.mapsService.off('viewchange', this.update);
         this.updateCloseOnClick(true);
         this.updateCloseOnEsc(true);
-        this.updateFollowCursor(true); // @ts-ignore
-
+        this.updateFollowCursor(true);
+        // @ts-ignore
         delete this.mapsService;
       }
-
       this.emit('close');
       return this;
     }
+
     /**
      * 获取 option 配置
      */
-
   }, {
     key: "getOptions",
     value: function getOptions() {
@@ -277,47 +235,38 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
     value: function setOptions(option) {
       this.show();
       this.popupOption = _objectSpread(_objectSpread({}, this.popupOption), option);
-
       if (this.checkUpdateOption(option, ['html', 'text', 'title', 'closeButton', 'closeButtonOffsets', 'maxWidth', 'anchor', 'stopPropagation', 'className', 'style', 'lngLat', 'offsets'])) {
         if (this.container) {
-          DOM.remove(this.container); // @ts-ignore
-
+          DOM.remove(this.container);
+          // @ts-ignore
           this.container = undefined;
         }
-
         if (this.popupOption.html) {
           this.setHTML(this.popupOption.html);
         } else if (this.popupOption.text) {
           this.setText(this.popupOption.text);
         }
-
         if (this.popupOption.title) {
           this.setTitle(this.popupOption.title);
         }
       }
-
       if (this.checkUpdateOption(option, ['closeOnEsc'])) {
         this.updateCloseOnEsc();
       }
-
       if (this.checkUpdateOption(option, ['closeOnClick'])) {
         this.updateCloseOnClick();
       }
-
       if (this.checkUpdateOption(option, ['followCursor'])) {
         this.updateFollowCursor();
       }
-
       if (this.checkUpdateOption(option, ['html']) && option.html) {
         this.setHTML(option.html);
       } else if (this.checkUpdateOption(option, ['text']) && option.text) {
         this.setText(option.text);
       }
-
       if (this.checkUpdateOption(option, ['lngLat']) && option.lngLat) {
         this.setLnglat(option.lngLat);
       }
-
       return this;
     }
   }, {
@@ -338,11 +287,9 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
       if (this.isShow) {
         return;
       }
-
       if (this.container) {
         DOM.removeClass(this.container, 'l7-popup-hide');
       }
-
       this.isShow = true;
       this.emit('show');
       return this;
@@ -353,31 +300,29 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
       if (!this.isShow) {
         return;
       }
-
       if (this.container) {
         DOM.addClass(this.container, 'l7-popup-hide');
       }
-
       this.isShow = false;
       this.emit('hide');
       return this;
     }
+
     /**
      * 设置 HTML 内容
      * @param html
      */
-
   }, {
     key: "setHTML",
     value: function setHTML(html) {
       this.popupOption.html = html;
       return this.setDOMContent(html);
     }
+
     /**
      * 设置 Popup 展示文本
      * @param text
      */
-
   }, {
     key: "setText",
     value: function setText(text) {
@@ -389,18 +334,15 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
     value: function setTitle(title) {
       this.show();
       this.popupOption.title = title;
-
       if (title) {
         if (!this.contentTitle) {
           this.contentTitle = DOM.create('div', 'l7-popup-content__title');
-
           if (this.content.firstChild) {
             this.content.insertBefore(this.contentTitle, this.content.firstChild);
           } else {
             this.content.append(this.contentTitle);
           }
         }
-
         DOM.clearChildren(this.contentTitle);
         DOM.appendElementType(this.contentTitle, title);
       } else if (this.contentTitle) {
@@ -408,21 +350,19 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
         this.contentTitle = undefined;
       }
     }
+
     /**
      * 将地图自动平移到气泡位置
      */
-
   }, {
     key: "panToPopup",
     value: function panToPopup() {
       var _this$lngLat2 = this.lngLat,
-          lng = _this$lngLat2.lng,
-          lat = _this$lngLat2.lat;
-
+        lng = _this$lngLat2.lng,
+        lat = _this$lngLat2.lat;
       if (this.popupOption.autoPan) {
         this.mapsService.panTo([lng, lat]);
       }
-
       return this;
     }
   }, {
@@ -430,26 +370,23 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
     value: function setLngLat(lngLat) {
       return this.setLnglat(lngLat);
     }
+
     /**
      * 设置 Popup 所在经纬度
      * @param lngLat
      */
-
   }, {
     key: "setLnglat",
     value: function setLnglat(lngLat) {
       var _this2 = this;
-
       this.show();
       this.lngLat = lngLat;
-
       if (Array.isArray(lngLat)) {
         this.lngLat = {
           lng: lngLat[0],
           lat: lngLat[1]
         };
       }
-
       if (this.mapsService) {
         // 防止事件重复监听
         this.mapsService.off('camerachange', this.update);
@@ -457,31 +394,28 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
         this.mapsService.on('camerachange', this.update);
         this.mapsService.on('viewchange', this.update);
       }
-
       this.update();
-
       if (this.popupOption.autoPan) {
         setTimeout(function () {
           _this2.panToPopup();
         }, 0);
       }
-
       return this;
     }
+
     /**
      * 获取 Popup 所在经纬度
      */
-
   }, {
     key: "getLnglat",
     value: function getLnglat() {
       return this.lngLat;
     }
+
     /**
      * 设置 Popup 最大宽度
      * @param maxWidth
      */
-
   }, {
     key: "setMaxWidth",
     value: function setMaxWidth(maxWidth) {
@@ -496,7 +430,8 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
     }
   }, {
     key: "getDefault",
-    value: // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    value:
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     function getDefault(option) {
       // tslint:disable-next-line:no-object-literal-type-assertion
       return {
@@ -512,11 +447,11 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
         followCursor: false
       };
     }
+
     /**
      * 设置 Popup 内容 HTML
      * @param element
      */
-
   }, {
     key: "setDOMContent",
     value: function setDOMContent(element) {
@@ -526,21 +461,18 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
       this.update();
       return this;
     }
+
     /**
      * 绑定地图点击事件触发销毁 Popup
      * @protected
      */
-
   }, {
     key: "updateCloseOnClick",
     value: function updateCloseOnClick(onlyClear) {
       var _this3 = this;
-
       var mapsService = this.mapsService;
-
       if (mapsService) {
         mapsService === null || mapsService === void 0 ? void 0 : mapsService.off('click', this.onCloseButtonClick);
-
         if (this.popupOption.closeOnClick && !onlyClear) {
           requestAnimationFrame(function () {
             mapsService === null || mapsService === void 0 ? void 0 : mapsService.on('click', _this3.onCloseButtonClick);
@@ -552,7 +484,6 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
     key: "updateCloseOnEsc",
     value: function updateCloseOnEsc(onlyClear) {
       window.removeEventListener('keydown', this.onKeyDown);
-
       if (this.popupOption.closeOnEsc && !onlyClear) {
         window.addEventListener('keydown', this.onKeyDown);
       }
@@ -561,12 +492,9 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
     key: "updateFollowCursor",
     value: function updateFollowCursor(onlyClear) {
       var _this$mapsService;
-
       var container = (_this$mapsService = this.mapsService) === null || _this$mapsService === void 0 ? void 0 : _this$mapsService.getContainer();
-
       if (container) {
         container === null || container === void 0 ? void 0 : container.removeEventListener('mousemove', this.onMouseMove);
-
         if (this.popupOption.followCursor && !onlyClear) {
           container === null || container === void 0 ? void 0 : container.addEventListener('mousemove', this.onMouseMove);
         }
@@ -581,27 +509,23 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
      */
     function createContent() {
       var _this4 = this;
-
       if (this.content) {
         DOM.remove(this.content);
       }
-
       this.contentTitle = undefined;
       this.content = DOM.create('div', 'l7-popup-content', this.container);
       this.setTitle(this.popupOption.title);
-
       if (this.popupOption.closeButton) {
         var closeButton = createL7Icon('l7-icon-guanbi');
         DOM.addClass(closeButton, 'l7-popup-close-button');
         this.content.appendChild(closeButton);
-
         if (this.popupOption.closeButtonOffsets) {
           // 关闭按钮的偏移
           closeButton.style.right = this.popupOption.closeButtonOffsets[0] + 'px';
           closeButton.style.top = this.popupOption.closeButtonOffsets[1] + 'px';
-        } // this.closeButton.type = 'button';
-
+        }
 
+        // this.closeButton.type = 'button';
         closeButton.setAttribute('aria-label', 'Close popup');
         closeButton.addEventListener('click', function () {
           _this4.hide();
@@ -610,7 +534,6 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
       } else {
         this.closeButton = undefined;
       }
-
       this.contentPanel = DOM.create('div', 'l7-popup-content__panel', this.content);
     }
   }, {
@@ -629,13 +552,13 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
         this.container.style.top = top - offsets[1] + 'px';
       }
     }
+
     /**
      * 检查当前传入 option 是否包含 keys 字段
      * @param option
      * @param keys
      * @protected
      */
-
   }, {
     key: "checkUpdateOption",
     value: function checkUpdateOption(option, keys) {
@@ -644,8 +567,6 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
       });
     }
   }]);
-
   return Popup;
 }(EventEmitter);
-
 export { Popup as default };

package/es/utils/anchor.js

@@ -1,6 +1,4 @@
-export var anchorType;
-
-(function (anchorType) {
+export var anchorType = /*#__PURE__*/function (anchorType) {
   anchorType["CENTER"] = "center";
   anchorType["TOP"] = "top";
   anchorType["TOP-LEFT"] = "top-left";
@@ -9,8 +7,8 @@ export var anchorType;
   anchorType["BOTTOM-LEFT"] = "bottom-left";
   anchorType["LEFT"] = "left";
   anchorType["RIGHT"] = "right";
-})(anchorType || (anchorType = {}));
-
+  return anchorType;
+}({});
 export var anchorTranslate = {
   center: 'translate(-50%,-50%)',
   top: 'translate(-50%,0)',
@@ -24,12 +22,10 @@ export var anchorTranslate = {
 };
 export function applyAnchorClass(element, anchor, prefix) {
   var classList = element.classList;
-
   for (var key in anchorTranslate) {
     if (anchorTranslate.hasOwnProperty(key)) {
       classList.remove("l7-".concat(prefix, "-anchor-").concat(key));
     }
   }
-
   classList.add("l7-".concat(prefix, "-anchor-").concat(anchor));
 }