@antv/l7-component 2.9.37-alpha.1 → 2.9.37-alpha.2

package/lib/popup/popup.js

@@ -1,651 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.Popup = void 0;
-
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
-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;
-
-      _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;
-
-      var _this$mapsService$lng = _this.mapsService.lngLatToContainer([lng, lat]),
-          x = _this$mapsService$lng.x,
-          y = _this$mapsService$lng.y;
-
-      _this.setPopupPosition(x, y);
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onKeyDown", function (e) {
-      if (e.keyCode === 27) {
-        _this.remove();
-      }
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onCloseButtonClick", function (e) {
-      if (e.stopPropagation) {
-        e.stopPropagation();
-      }
-
-      _this.remove();
-    });
-    (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;
-
-      if (!_this.mapsService || !hasPosition || !_this.content) {
-        return;
-      }
-
-      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); // 高德地图需要阻止事件冒泡 // 测试mapbox 地图不需要添加
-
-
-        if (stopPropagation) {
-          ['mousemove', 'mousedown', 'mouseup', 'click', 'dblclick'].forEach(function (type) {
-            _this.container.addEventListener(type, function (e) {
-              e.stopPropagation();
-            });
-          });
-        }
-
-        _this.container.style.whiteSpace = 'nowrap';
-      } // 设置 Popup 的最大宽度
-
-
-      if (maxWidth && _this.container.style.maxWidth !== maxWidth) {
-        _this.container.style.maxWidth = maxWidth;
-      }
-
-      _this.updateLngLatPosition();
-
-      _l7Utils.DOM.setTransform(_this.container, "".concat(_l7Utils.anchorTranslate[anchor]));
-
-      (0, _l7Utils.applyAnchorClass)(_this.container, anchor, 'popup');
-    });
-    _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:
-    /**
-     * 配置
-     * @protected
-     */
-
-    /**
-     * 关闭按钮对应的 DOM
-     * @protected
-     */
-
-    /**
-     * Popup 的总容器 DOM，包含 content 和 tip
-     * @protected
-     */
-
-    /**
-     * popup 气泡容器
-     * @protected
-     */
-
-    /**
-     * popup 气泡标题
-     * @protected
-     */
-
-    /**
-     * popup 内容容器
-     * @protected
-     */
-
-    /**
-     * popup 内容标题
-     * @protected
-     */
-
-    /**
-     * 气泡箭头对应的 DOM
-     * @protected
-     */
-
-    /**
-     * 当前是否展示
-     * @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
-      };
-    },
-    set: function set(newLngLat) {
-      this.popupOption.lngLat = newLngLat;
-    }
-  }, {
-    key: "getIsShow",
-    value: function getIsShow() {
-      return this.isShow;
-    }
-  }, {
-    key: "addTo",
-    value: function addTo(scene) {
-      this.mapsService = scene.get(_l7Core.TYPES.IMapService);
-      this.sceneService = scene.get(_l7Core.TYPES.ISceneService);
-      this.layerService = scene.get(_l7Core.TYPES.ILayerService);
-      this.mapsService.on('camerachange', this.update);
-      this.mapsService.on('viewchange', this.update);
-      this.scene = scene;
-      this.update();
-      this.updateCloseOnClick();
-      this.updateCloseOnEsc();
-      this.updateFollowCursor();
-      var _this$popupOption2 = this.popupOption,
-          html = _this$popupOption2.html,
-          text = _this$popupOption2.text;
-
-      if (html) {
-        this.setHTML(html);
-      } else if (text) {
-        this.setText(text);
-      }
-
-      this.emit('open');
-      return this;
-    } // 移除popup
-
-  }, {
-    key: "remove",
-    value: function remove() {
-      if (!this.isOpen()) {
-        return;
-      }
-
-      if (this.content) {
-        _l7Utils.DOM.remove(this.content);
-      }
-
-      if (this.container) {
-        _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
-
-        delete this.mapsService;
-      }
-
-      this.emit('close');
-      return this;
-    }
-    /**
-     * 获取 option 配置
-     */
-
-  }, {
-    key: "getOptions",
-    value: function getOptions() {
-      return this.popupOption;
-    }
-  }, {
-    key: "setOptions",
-    value: function setOptions(option) {
-      this.popupOption = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, this.popupOption), option);
-
-      if (this.checkUpdateOption(option, ['closeButton', 'closeButtonOffsets', 'maxWidth', 'anchor', 'stopPropagation', 'className', 'style', 'lngLat', 'offsets', 'title'])) {
-        if (this.container) {
-          _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.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;
-    }
-  }, {
-    key: "open",
-    value: function open() {
-      this.addTo(this.scene);
-      return this;
-    }
-  }, {
-    key: "close",
-    value: function close() {
-      this.remove();
-      return this;
-    }
-  }, {
-    key: "show",
-    value: function show() {
-      if (this.isShow) {
-        return;
-      }
-
-      if (this.container) {
-        _l7Utils.DOM.removeClass(this.container, 'l7-popup-hide');
-      }
-
-      this.isShow = true;
-      this.emit('show');
-      return this;
-    }
-  }, {
-    key: "hide",
-    value: function hide() {
-      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(this.getPopupHTMLFragment(html));
-    }
-    /**
-     * 设置 Popup 展示文本
-     * @param text
-     */
-
-  }, {
-    key: "setText",
-    value: function setText(text) {
-      this.popupOption.text = text;
-      return this.setDOMContent(window.document.createTextNode(text));
-    }
-    /**
-     * 将地图自动平移到气泡位置
-     */
-
-  }, {
-    key: "panToPopup",
-    value: function panToPopup() {
-      var _this$lngLat2 = this.lngLat,
-          lng = _this$lngLat2.lng,
-          lat = _this$lngLat2.lat;
-
-      if (this.popupOption.autoPan) {
-        this.mapsService.panTo([lng, lat]);
-      }
-
-      return this;
-    }
-  }, {
-    key: "setLngLat",
-    value: function setLngLat(lngLat) {
-      return this.setLnglat(lngLat);
-    }
-    /**
-     * 设置 Popup 所在经纬度
-     * @param lngLat
-     */
-
-  }, {
-    key: "setLnglat",
-    value: function setLnglat(lngLat) {
-      var _this2 = this;
-
-      this.lngLat = lngLat;
-
-      if (Array.isArray(lngLat)) {
-        this.lngLat = {
-          lng: lngLat[0],
-          lat: lngLat[1]
-        };
-      }
-
-      if (this.mapsService) {
-        // 防止事件重复监听
-        this.mapsService.off('camerachange', this.update);
-        this.mapsService.off('viewchange', this.update);
-        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) {
-      this.popupOption.maxWidth = maxWidth;
-      this.update();
-      return this;
-    }
-  }, {
-    key: "isOpen",
-    value: function isOpen() {
-      return !!this.mapsService;
-    }
-  }, {
-    key: "getDefault",
-    value: function getDefault(option) {
-      // tslint:disable-next-line:no-object-literal-type-assertion
-      return {
-        closeButton: true,
-        closeOnClick: true,
-        maxWidth: '240px',
-        offsets: [0, 0],
-        anchor: _l7Utils.anchorType.BOTTOM,
-        stopPropagation: true,
-        autoPan: false,
-        autoClose: true,
-        closeOnEsc: false,
-        followCursor: false
-      };
-    }
-    /**
-     * 设置 Popup 内容 HTML
-     * @param htmlNode
-     */
-
-  }, {
-    key: "setDOMContent",
-    value: function setDOMContent(htmlNode) {
-      this.createContent();
-      this.contentPanel.appendChild(htmlNode);
-      this.update();
-      return this;
-    }
-    /**
-     * 绑定地图点击事件触发销毁 Popup
-     * @protected
-     */
-
-  }, {
-    key: "updateCloseOnClick",
-    value: function updateCloseOnClick(onlyClear) {
-      this.mapsService.off('click', this.onCloseButtonClick);
-
-      if (this.popupOption.closeOnClick && !onlyClear) {
-        this.mapsService.on('click', this.onCloseButtonClick);
-      }
-    }
-  }, {
-    key: "updateCloseOnEsc",
-    value: function updateCloseOnEsc(onlyClear) {
-      window.removeEventListener('keydown', this.onKeyDown);
-
-      if (this.popupOption.closeOnEsc && !onlyClear) {
-        window.addEventListener('keydown', this.onKeyDown);
-      }
-    }
-  }, {
-    key: "updateFollowCursor",
-    value: function updateFollowCursor(onlyClear) {
-      var container = this.mapsService.getContainer();
-      container.removeEventListener('mousemove', this.onMouseMove);
-
-      if (this.popupOption.followCursor && !onlyClear) {
-        container.addEventListener('mousemove', this.onMouseMove);
-      }
-    }
-  }, {
-    key: "createContent",
-    value:
-    /**
-     * 创建 Popup 内容容器的 DOM （在每次 setHTML 或 setText 时都会被调用）
-     * @protected
-     */
-    function createContent() {
-      if (this.content) {
-        _l7Utils.DOM.remove(this.content);
-      }
-
-      this.content = _l7Utils.DOM.create('div', 'l7-popup-content', this.container);
-
-      if (this.popupOption.title) {
-        var _this$contentTitle;
-
-        this.contentTitle = _l7Utils.DOM.create('div', 'l7-popup-content__title', this.content);
-        (_this$contentTitle = this.contentTitle) === null || _this$contentTitle === void 0 ? void 0 : _this$contentTitle.append(this.getPopupHTMLFragment(this.popupOption.title));
-      } else {
-        this.contentTitle = undefined;
-      }
-
-      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';
-
-
-        closeButton.setAttribute('aria-label', 'Close popup');
-        closeButton.addEventListener('click', this.onCloseButtonClick);
-        this.closeButton = closeButton;
-      } else {
-        this.closeButton = undefined;
-      }
-
-      this.contentPanel = _l7Utils.DOM.create('div', 'l7-popup-content__panel', this.content);
-    }
-  }, {
-    key: "setPopupPosition",
-    value:
-    /**
-     * 设置 Popup 相对于地图容器的 Position
-     * @param left
-     * @param top
-     * @protected
-     */
-    function setPopupPosition(left, top) {
-      if (this.container) {
-        var offsets = this.popupOption.offsets;
-        this.container.style.left = left + offsets[0] + 'px';
-        this.container.style.top = top - offsets[1] + 'px';
-      }
-    }
-    /**
-     * 检查当前传入 option 是否包含 keys 字段
-     * @param option
-     * @param keys
-     * @protected
-     */
-
-  }, {
-    key: "checkUpdateOption",
-    value: function checkUpdateOption(option, keys) {
-      return keys.some(function (key) {
-        return key in option;
-      });
-    }
-    /**
-     * 根据参数 HTML 片段返回对应的 Fragment
-     * @param html
-     * @protected
-     */
-
-  }, {
-    key: "getPopupHTMLFragment",
-    value: function getPopupHTMLFragment(html) {
-      var frag = window.document.createDocumentFragment();
-      var temp = window.document.createElement('body');
-      var child;
-
-      if (typeof html === 'string') {
-        temp.innerHTML = html;
-      } else if (Array.isArray(html)) {
-        temp.append.apply(temp, (0, _toConsumableArray2.default)(html));
-      } else if (html instanceof HTMLElement) {
-        temp.append(html);
-      }
-
-      while (true) {
-        child = temp.firstChild;
-
-        if (!child) {
-          break;
-        }
-
-        frag.appendChild(child);
-      }
-
-      return frag;
-    }
-  }]);
-  return Popup;
-}(_eventemitter.EventEmitter);
-
-exports.default = exports.Popup = Popup;

package/lib/utils/anchor.js

@@ -1,45 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.anchorType = exports.anchorTranslate = void 0;
-exports.applyAnchorClass = applyAnchorClass;
-var anchorType;
-exports.anchorType = anchorType;
-
-(function (anchorType) {
-  anchorType["CENTER"] = "center";
-  anchorType["TOP"] = "top";
-  anchorType["TOP-LEFT"] = "top-left";
-  anchorType["TOP-RIGHT"] = "top-right";
-  anchorType["BOTTOM"] = "bottom";
-  anchorType["BOTTOM-LEFT"] = "bottom-left";
-  anchorType["LEFT"] = "left";
-  anchorType["RIGHT"] = "right";
-})(anchorType || (exports.anchorType = anchorType = {}));
-
-var anchorTranslate = {
-  center: 'translate(-50%,-50%)',
-  top: 'translate(-50%,0)',
-  'top-left': 'translate(0,0)',
-  'top-right': 'translate(-100%,0)',
-  bottom: 'translate(-50%,-100%)',
-  'bottom-left': 'translate(0,-100%)',
-  'bottom-right': 'translate(-100%,-100%)',
-  left: 'translate(0,-50%)',
-  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

@@ -1,18 +0,0 @@
-"use strict";
-
-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');
-  svg.setAttribute('aria-hidden', 'true');
-  var use = document.createElementNS('http://www.w3.org/2000/svg', 'use');
-  use.setAttributeNS('http://www.w3.org/1999/xlink', 'href', "#".concat(className));
-  svg.appendChild(use);
-  return svg;
-};
-
-exports.createL7Icon = createL7Icon;