@antv/l7-component 2.17.4 → 2.17.5

package/lib/popup/popup.js

@@ -1,77 +1,52 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.Popup = 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 _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 _l7Core = require("@antv/l7-core");
-
 var _l7Utils = require("@antv/l7-utils");
-
 var _eventemitter = require("eventemitter3");
-
 var _icon = require("../utils/icon");
-
 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 Popup = /*#__PURE__*/function (_EventEmitter) {
   (0, _inherits2.default)(Popup, _EventEmitter);
-
   var _super = _createSuper(Popup);
-
   function Popup(cfg) {
     var _this;
-
     (0, _classCallCheck2.default)(this, Popup);
     _this = _super.call(this);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "isShow", true);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_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);
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_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);
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onKeyDown", function (e) {
@@ -83,37 +58,30 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
       if (e.stopPropagation) {
         e.stopPropagation();
       }
-
       _this.hide();
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_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 = _l7Utils.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 = _l7Utils.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) {
@@ -121,20 +89,14 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
             });
           });
         }
-
         _this.container.style.whiteSpace = 'nowrap';
       }
-
       _this.updateLngLatPosition();
-
       _l7Utils.DOM.setTransform(_this.container, "".concat(_l7Utils.anchorTranslate[anchor]));
-
       (0, _l7Utils.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;
         }
@@ -144,14 +106,11 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
     });
     _this.popupOption = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, _this.getDefault(cfg !== null && cfg !== void 0 ? cfg : {})), cfg);
     var lngLat = _this.popupOption.lngLat;
-
     if (lngLat) {
       _this.lngLat = lngLat;
     }
-
     return _this;
   }
-
   (0, _createClass2.default)(Popup, [{
     key: "lngLat",
     get:
@@ -194,9 +153,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
@@ -219,66 +178,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) {
         _l7Utils.DOM.remove(this.content);
       }
-
       if (this.container) {
-        _l7Utils.DOM.remove(this.container); // @ts-ignore
-
-
+        _l7Utils.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() {
@@ -289,48 +241,38 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
     value: function setOptions(option) {
       this.show();
       this.popupOption = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, this.popupOption), option);
-
       if (this.checkUpdateOption(option, ['html', 'text', 'title', 'closeButton', 'closeButtonOffsets', 'maxWidth', 'anchor', 'stopPropagation', 'className', 'style', 'lngLat', 'offsets'])) {
         if (this.container) {
-          _l7Utils.DOM.remove(this.container); // @ts-ignore
-
-
+          _l7Utils.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;
     }
   }, {
@@ -351,11 +293,9 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
       if (this.isShow) {
         return;
       }
-
       if (this.container) {
         _l7Utils.DOM.removeClass(this.container, 'l7-popup-hide');
       }
-
       this.isShow = true;
       this.emit('show');
       return this;
@@ -366,31 +306,29 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
       if (!this.isShow) {
         return;
       }
-
       if (this.container) {
         _l7Utils.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) {
@@ -402,42 +340,35 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
     value: function setTitle(title) {
       this.show();
       this.popupOption.title = title;
-
       if (title) {
         if (!this.contentTitle) {
           this.contentTitle = _l7Utils.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);
           }
         }
-
         _l7Utils.DOM.clearChildren(this.contentTitle);
-
         _l7Utils.DOM.appendElementType(this.contentTitle, title);
       } else if (this.contentTitle) {
         _l7Utils.DOM.remove(this.contentTitle);
-
         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;
     }
   }, {
@@ -445,26 +376,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);
@@ -472,31 +400,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) {
@@ -511,7 +436,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 {
@@ -527,37 +453,32 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
         followCursor: false
       };
     }
+
     /**
      * 设置 Popup 内容 HTML
      * @param element
      */
-
   }, {
     key: "setDOMContent",
     value: function setDOMContent(element) {
       this.show();
       this.createContent();
-
       _l7Utils.DOM.appendElementType(this.contentPanel, element);
-
       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);
@@ -569,7 +490,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);
       }
@@ -578,12 +498,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);
         }
@@ -598,29 +515,23 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
      */
     function createContent() {
       var _this4 = this;
-
       if (this.content) {
         _l7Utils.DOM.remove(this.content);
       }
-
       this.contentTitle = undefined;
       this.content = _l7Utils.DOM.create('div', 'l7-popup-content', this.container);
       this.setTitle(this.popupOption.title);
-
       if (this.popupOption.closeButton) {
         var closeButton = (0, _icon.createL7Icon)('l7-icon-guanbi');
-
         _l7Utils.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();
@@ -629,7 +540,6 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
       } else {
         this.closeButton = undefined;
       }
-
       this.contentPanel = _l7Utils.DOM.create('div', 'l7-popup-content__panel', this.content);
     }
   }, {
@@ -648,13 +558,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) {
@@ -665,5 +575,4 @@ var Popup = /*#__PURE__*/function (_EventEmitter) {
   }]);
   return Popup;
 }(_eventemitter.EventEmitter);
-
 exports.default = exports.Popup = Popup;

package/lib/utils/anchor.js

@@ -5,10 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.anchorType = exports.anchorTranslate = void 0;
 exports.applyAnchorClass = applyAnchorClass;
-var anchorType;
-exports.anchorType = anchorType;
-
-(function (anchorType) {
+var anchorType = /*#__PURE__*/function (anchorType) {
   anchorType["CENTER"] = "center";
   anchorType["TOP"] = "top";
   anchorType["TOP-LEFT"] = "top-left";
@@ -17,8 +14,9 @@ exports.anchorType = anchorType;
   anchorType["BOTTOM-LEFT"] = "bottom-left";
   anchorType["LEFT"] = "left";
   anchorType["RIGHT"] = "right";
-})(anchorType || (exports.anchorType = anchorType = {}));
-
+  return anchorType;
+}({});
+exports.anchorType = anchorType;
 var anchorTranslate = {
   center: 'translate(-50%,-50%)',
   top: 'translate(-50%,0)',
@@ -31,15 +29,12 @@ var anchorTranslate = {
   right: 'translate(-100%,-50%)'
 };
 exports.anchorTranslate = anchorTranslate;
-
 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));
 }

package/lib/utils/icon.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createL7Icon = void 0;
-
 var createL7Icon = function createL7Icon(className) {
   var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
   svg.classList.add('l7-iconfont');
@@ -14,5 +13,4 @@ var createL7Icon = function createL7Icon(className) {
   svg.appendChild(use);
   return svg;
 };
-
 exports.createL7Icon = createL7Icon;