@antv/l7-scene 2.21.0 → 2.21.2

package/es/index.js

@@ -1,48 +1,65 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-import { Logo } from '@antv/l7-component';
-import { SceneEventList, createLayerContainer, createSceneContainer } from '@antv/l7-core';
-import { MaskLayer, TileLayer } from '@antv/l7-layers';
-import { DeviceRendererService, ReglRendererService } from '@antv/l7-renderer';
-import { DOM, SceneConifg } from '@antv/l7-utils';
-import BoxSelect, { BoxSelectEventList } from "./boxSelect";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
 
-/**
- * 暴露 Scene API
- *
- * @example
- * import { Scene } from 'l7/scene';
- * import { PointLayer } from 'l7/layers';
- *
- * const scene = new Scene();
- * const pointLayer = new PointLayer();
- * scene.addLayer(pointLayer);
- *
- */
-var Scene = /*#__PURE__*/function () {
-  function Scene(config) {
-    _classCallCheck(this, Scene);
-    var id = config.id,
-      map = config.map,
-      canvas = config.canvas,
-      _config$renderer = config.renderer,
-      renderer = _config$renderer === void 0 ? 'regl' : _config$renderer;
-    // 创建场景容器
-    var sceneContainer = createSceneContainer();
+// src/index.ts
+import { Logo } from "@antv/l7-component";
+import {
+  SceneEventList,
+  createLayerContainer,
+  createSceneContainer
+} from "@antv/l7-core";
+import { MaskLayer, TileLayer } from "@antv/l7-layers";
+import { DeviceRendererService, ReglRendererService } from "@antv/l7-renderer";
+import { DOM, SceneConifg } from "@antv/l7-utils";
+import BoxSelect, { BoxSelectEventList } from "./boxSelect";
+var Scene = class {
+  constructor(config) {
+    const { id, map, canvas, renderer = "regl" } = config;
+    const sceneContainer = createSceneContainer();
     this.container = sceneContainer;
-    // 绑定地图服务
     map.setContainer(sceneContainer, id, canvas);
-    if (renderer === 'regl') {
+    if (renderer === "regl") {
       sceneContainer.rendererService = new ReglRendererService();
     } else {
       sceneContainer.rendererService = new DeviceRendererService();
     }
-
-    // 依赖注入
     this.sceneService = sceneContainer.sceneService;
     this.mapService = sceneContainer.mapService;
     this.iconService = sceneContainer.iconService;
@@ -56,668 +73,401 @@ var Scene = /*#__PURE__*/function () {
     this.popupService = sceneContainer.popupService;
     this.boxSelect = new BoxSelect(this, {});
     this.initComponent(id);
-
-    // 初始化 scene
     this.sceneService.init(config);
-    // TODO: 初始化组件
-
     this.initControl();
   }
-  _createClass(Scene, [{
-    key: "map",
-    get: function get() {
-      return this.mapService.map;
-    }
-  }, {
-    key: "loaded",
-    get: function get() {
-      return this.sceneService.loaded;
-    }
-  }, {
-    key: "getServiceContainer",
-    value: function getServiceContainer() {
-      return this.container;
-    }
-  }, {
-    key: "getSize",
-    value: function getSize() {
-      return this.mapService.getSize();
-    }
-  }, {
-    key: "getMinZoom",
-    value: function getMinZoom() {
-      return this.mapService.getMinZoom();
-    }
-  }, {
-    key: "getMaxZoom",
-    value: function getMaxZoom() {
-      return this.mapService.getMaxZoom();
-    }
-  }, {
-    key: "getType",
-    value: function getType() {
-      return this.mapService.getType();
-    }
-  }, {
-    key: "getMapContainer",
-    value: function getMapContainer() {
-      return this.mapService.getMapContainer();
-    }
-  }, {
-    key: "getMapCanvasContainer",
-    value: function getMapCanvasContainer() {
-      return this.mapService.getMapCanvasContainer();
-    }
-  }, {
-    key: "getMapService",
-    value: function getMapService() {
-      return this.mapService;
-    }
-
-    /**
-     * 对外暴露 debugService
-     * @returns
-     */
-  }, {
-    key: "getDebugService",
-    value: function getDebugService() {
-      return this.debugService;
-    }
-  }, {
-    key: "exportPng",
-    value: function () {
-      var _exportPng = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(type) {
-        return _regeneratorRuntime.wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              return _context.abrupt("return", this.sceneService.exportPng(type));
-            case 1:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee, this);
-      }));
-      function exportPng(_x) {
-        return _exportPng.apply(this, arguments);
-      }
-      return exportPng;
-    }()
-  }, {
-    key: "exportMap",
-    value: function () {
-      var _exportMap = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(type) {
-        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-          while (1) switch (_context2.prev = _context2.next) {
-            case 0:
-              return _context2.abrupt("return", this.sceneService.exportPng(type));
-            case 1:
-            case "end":
-              return _context2.stop();
-          }
-        }, _callee2, this);
-      }));
-      function exportMap(_x2) {
-        return _exportMap.apply(this, arguments);
-      }
-      return exportMap;
-    }()
-  }, {
-    key: "registerRenderService",
-    value: function registerRenderService(render) {
-      var _this = this;
-      if (this.sceneService.loaded) {
-        var renderSerivce = new render(this);
+  get map() {
+    return this.mapService.map;
+  }
+  get loaded() {
+    return this.sceneService.loaded;
+  }
+  getServiceContainer() {
+    return this.container;
+  }
+  getSize() {
+    return this.mapService.getSize();
+  }
+  getMinZoom() {
+    return this.mapService.getMinZoom();
+  }
+  getMaxZoom() {
+    return this.mapService.getMaxZoom();
+  }
+  getType() {
+    return this.mapService.getType();
+  }
+  getMapContainer() {
+    return this.mapService.getMapContainer();
+  }
+  getMapCanvasContainer() {
+    return this.mapService.getMapCanvasContainer();
+  }
+  getMapService() {
+    return this.mapService;
+  }
+  /**
+   * 对外暴露 debugService
+   * @returns
+   */
+  getDebugService() {
+    return this.debugService;
+  }
+  exportPng(type) {
+    return __async(this, null, function* () {
+      return this.sceneService.exportPng(type);
+    });
+  }
+  exportMap(type) {
+    return __async(this, null, function* () {
+      return this.sceneService.exportPng(type);
+    });
+  }
+  registerRenderService(render) {
+    if (this.sceneService.loaded) {
+      const renderSerivce = new render(this);
+      renderSerivce.init();
+    } else {
+      this.on("loaded", () => {
+        const renderSerivce = new render(this);
         renderSerivce.init();
-      } else {
-        this.on('loaded', function () {
-          var renderSerivce = new render(_this);
-          renderSerivce.init();
-        });
-      }
-    }
-  }, {
-    key: "setBgColor",
-    value: function setBgColor(color) {
-      this.mapService.setBgColor(color);
+      });
     }
-  }, {
-    key: "addLayer",
-    value: function addLayer(layer) {
-      var _this2 = this;
-      if (this.loaded) {
+  }
+  setBgColor(color) {
+    this.mapService.setBgColor(color);
+  }
+  addLayer(layer) {
+    if (this.loaded) {
+      this.preAddLayer(layer);
+    } else {
+      this.once("loaded", () => {
         this.preAddLayer(layer);
-      } else {
-        console.log('layer not loaded');
-        this.once('loaded', function () {
-          console.log('layer loaded');
-          _this2.preAddLayer(layer);
-        });
-      }
+      });
     }
-
-    // layer 管理
-  }, {
-    key: "preAddLayer",
-    value: function preAddLayer(layer) {
-      var _this3 = this;
-      // 为当前图层创建一个容器
-      // TODO: 初始化的时候设置 容器
-      var layerContainer = createLayerContainer(this.container);
-      layer.setContainer(layerContainer);
-      this.sceneService.addLayer(layer);
-
-      // mask 在 scene loaded 之后执行
-      if (layer.inited) {
+  }
+  // layer 管理
+  preAddLayer(layer) {
+    const layerContainer = createLayerContainer(this.container);
+    layer.setContainer(layerContainer);
+    this.sceneService.addLayer(layer);
+    if (layer.inited) {
+      this.initTileLayer(layer);
+      const maskInstance = this.initMask(layer);
+      this.addMask(maskInstance, layer.id);
+    } else {
+      layer.on("inited", () => {
         this.initTileLayer(layer);
-        var maskInstance = this.initMask(layer);
+        const maskInstance = this.initMask(layer);
         this.addMask(maskInstance, layer.id);
-      } else {
-        layer.on('inited', function () {
-          _this3.initTileLayer(layer);
-          var maskInstance = _this3.initMask(layer); // 初始化 mask
-          _this3.addMask(maskInstance, layer.id);
-        });
-      }
-    }
-    // 兼容历史接口
-  }, {
-    key: "initMask",
-    value: function initMask(layer) {
-      var _layer$getLayerConfig = layer.getLayerConfig(),
-        mask = _layer$getLayerConfig.mask,
-        maskfence = _layer$getLayerConfig.maskfence,
-        _layer$getLayerConfig2 = _layer$getLayerConfig.maskColor,
-        maskColor = _layer$getLayerConfig2 === void 0 ? '#000' : _layer$getLayerConfig2,
-        _layer$getLayerConfig3 = _layer$getLayerConfig.maskOpacity,
-        maskOpacity = _layer$getLayerConfig3 === void 0 ? 0 : _layer$getLayerConfig3;
-      if (!mask || !maskfence) {
-        return undefined;
-      }
-      var maskInstance = new MaskLayer().source(maskfence).shape('fill').style({
-        color: maskColor,
-        opacity: maskOpacity
       });
-      return maskInstance;
     }
-  }, {
-    key: "addMask",
-    value: function addMask(mask, layerId) {
-      if (!mask) {
-        return;
-      }
-      var parent = this.getLayer(layerId);
-      if (parent) {
-        var layerContainer = createLayerContainer(this.container);
-        mask.setContainer(layerContainer);
-        parent.addMaskLayer(mask);
-        this.sceneService.addMask(mask);
-      } else {
-        console.warn('parent layer not find!');
-      }
-    }
-  }, {
-    key: "getPickedLayer",
-    value: function getPickedLayer() {
-      return this.layerService.pickedLayerId;
-    }
-  }, {
-    key: "getLayers",
-    value: function getLayers() {
-      return this.layerService.getLayers();
-    }
-  }, {
-    key: "getLayer",
-    value: function getLayer(id) {
-      return this.layerService.getLayer(id);
-    }
-  }, {
-    key: "getLayerByName",
-    value: function getLayerByName(name) {
-      return this.layerService.getLayerByName(name);
-    }
-  }, {
-    key: "removeLayer",
-    value: function () {
-      var _removeLayer = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(layer, parentLayer) {
-        return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-          while (1) switch (_context3.prev = _context3.next) {
-            case 0:
-              _context3.next = 2;
-              return this.layerService.remove(layer, parentLayer);
-            case 2:
-            case "end":
-              return _context3.stop();
-          }
-        }, _callee3, this);
-      }));
-      function removeLayer(_x3, _x4) {
-        return _removeLayer.apply(this, arguments);
-      }
-      return removeLayer;
-    }()
-  }, {
-    key: "removeAllLayer",
-    value: function () {
-      var _removeAllLayer = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
-        return _regeneratorRuntime.wrap(function _callee4$(_context4) {
-          while (1) switch (_context4.prev = _context4.next) {
-            case 0:
-              _context4.next = 2;
-              return this.layerService.removeAllLayers();
-            case 2:
-            case "end":
-              return _context4.stop();
-          }
-        }, _callee4, this);
-      }));
-      function removeAllLayer() {
-        return _removeAllLayer.apply(this, arguments);
-      }
-      return removeAllLayer;
-    }()
-  }, {
-    key: "render",
-    value: function render() {
-      this.sceneService.render();
-    }
-  }, {
-    key: "setEnableRender",
-    value: function setEnableRender(flag) {
-      this.layerService.setEnableRender(flag);
+  }
+  // 兼容历史接口
+  initMask(layer) {
+    const {
+      mask,
+      maskfence,
+      maskColor = "#000",
+      maskOpacity = 0
+    } = layer.getLayerConfig();
+    if (!mask || !maskfence) {
+      return void 0;
+    }
+    const maskInstance = new MaskLayer().source(maskfence).shape("fill").style({
+      color: maskColor,
+      opacity: maskOpacity
+    });
+    return maskInstance;
+  }
+  addMask(mask, layerId) {
+    if (!mask) {
+      return;
+    }
+    const parent = this.getLayer(layerId);
+    if (parent) {
+      const layerContainer = createLayerContainer(this.container);
+      mask.setContainer(layerContainer);
+      parent.addMaskLayer(mask);
+      this.sceneService.addMask(mask);
+    } else {
+      console.warn("parent layer not find!");
     }
-
-    // asset method
-    /**
-     * 为 layer/point/text 支持 iconfont 模式支持
-     * @param fontUnicode
-     * @param name
-     */
-  }, {
-    key: "addIconFont",
-    value: function addIconFont(name, fontUnicode) {
+  }
+  getPickedLayer() {
+    return this.layerService.pickedLayerId;
+  }
+  getLayers() {
+    return this.layerService.getLayers();
+  }
+  getLayer(id) {
+    return this.layerService.getLayer(id);
+  }
+  getLayerByName(name) {
+    return this.layerService.getLayerByName(name);
+  }
+  removeLayer(layer, parentLayer) {
+    return __async(this, null, function* () {
+      yield this.layerService.remove(layer, parentLayer);
+    });
+  }
+  removeAllLayer() {
+    return __async(this, null, function* () {
+      yield this.layerService.removeAllLayers();
+    });
+  }
+  render() {
+    this.sceneService.render();
+  }
+  setEnableRender(flag) {
+    this.layerService.setEnableRender(flag);
+  }
+  // asset method
+  /**
+   * 为 layer/point/text 支持 iconfont 模式支持
+   * @param fontUnicode
+   * @param name
+   */
+  addIconFont(name, fontUnicode) {
+    this.fontService.addIconFont(name, fontUnicode);
+  }
+  addIconFonts(options) {
+    options.forEach(([name, fontUnicode]) => {
       this.fontService.addIconFont(name, fontUnicode);
+    });
+  }
+  /**
+   * 用户自定义添加第三方字体
+   * @param fontFamily
+   * @param fontPath
+   */
+  addFontFace(fontFamily, fontPath) {
+    this.fontService.once("fontloaded", (e) => {
+      this.emit("fontloaded", e);
+    });
+    this.fontService.addFontFace(fontFamily, fontPath);
+  }
+  addImage(id, img) {
+    return __async(this, null, function* () {
+      yield this.iconService.addImage(id, img);
+    });
+  }
+  hasImage(id) {
+    return this.iconService.hasImage(id);
+  }
+  removeImage(id) {
+    this.iconService.removeImage(id);
+  }
+  addIconFontGlyphs(fontFamily, glyphs) {
+    this.fontService.addIconGlyphs(glyphs);
+  }
+  // map control method
+  addControl(ctr) {
+    this.controlService.addControl(ctr, this.container);
+  }
+  removeControl(ctr) {
+    this.controlService.removeControl(ctr);
+  }
+  getControlByName(name) {
+    return this.controlService.getControlByName(name);
+  }
+  // marker
+  addMarker(marker) {
+    this.markerService.addMarker(marker);
+  }
+  addMarkerLayer(layer) {
+    this.markerService.addMarkerLayer(layer);
+  }
+  removeMarkerLayer(layer) {
+    this.markerService.removeMarkerLayer(layer);
+  }
+  removeAllMarkers() {
+    this.markerService.removeAllMarkers();
+  }
+  removeAllMakers() {
+    console.warn("removeAllMakers 已废弃，请使用 removeAllMarkers");
+    this.markerService.removeAllMarkers();
+  }
+  addPopup(popup) {
+    this.popupService.addPopup(popup);
+  }
+  removePopup(popup) {
+    this.popupService.removePopup(popup);
+  }
+  on(type, handle) {
+    var _a;
+    if (BoxSelectEventList.includes(type)) {
+      (_a = this.boxSelect) == null ? void 0 : _a.on(type, handle);
+    } else if (SceneEventList.includes(type)) {
+      this.sceneService.on(type, handle);
+    } else {
+      this.mapService.on(type, handle);
     }
-  }, {
-    key: "addIconFonts",
-    value: function addIconFonts(options) {
-      var _this4 = this;
-      options.forEach(function (_ref) {
-        var _ref2 = _slicedToArray(_ref, 2),
-          name = _ref2[0],
-          fontUnicode = _ref2[1];
-        _this4.fontService.addIconFont(name, fontUnicode);
-      });
-    }
-    /**
-     * 用户自定义添加第三方字体
-     * @param fontFamily
-     * @param fontPath
-     */
-  }, {
-    key: "addFontFace",
-    value: function addFontFace(fontFamily, fontPath) {
-      var _this5 = this;
-      this.fontService.once('fontloaded', function (e) {
-        _this5.emit('fontloaded', e);
-      });
-      this.fontService.addFontFace(fontFamily, fontPath);
-    }
-  }, {
-    key: "addImage",
-    value: function () {
-      var _addImage = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5(id, img) {
-        return _regeneratorRuntime.wrap(function _callee5$(_context5) {
-          while (1) switch (_context5.prev = _context5.next) {
-            case 0:
-              _context5.next = 2;
-              return this.iconService.addImage(id, img);
-            case 2:
-            case "end":
-              return _context5.stop();
-          }
-        }, _callee5, this);
-      }));
-      function addImage(_x5, _x6) {
-        return _addImage.apply(this, arguments);
-      }
-      return addImage;
-    }()
-  }, {
-    key: "hasImage",
-    value: function hasImage(id) {
-      return this.iconService.hasImage(id);
-    }
-  }, {
-    key: "removeImage",
-    value: function removeImage(id) {
-      this.iconService.removeImage(id);
-    }
-  }, {
-    key: "addIconFontGlyphs",
-    value: function addIconFontGlyphs(fontFamily, glyphs) {
-      this.fontService.addIconGlyphs(glyphs);
-    }
-
-    // map control method
-  }, {
-    key: "addControl",
-    value: function addControl(ctr) {
-      this.controlService.addControl(ctr, this.container);
-    }
-  }, {
-    key: "removeControl",
-    value: function removeControl(ctr) {
-      this.controlService.removeControl(ctr);
-    }
-  }, {
-    key: "getControlByName",
-    value: function getControlByName(name) {
-      return this.controlService.getControlByName(name);
-    }
-
-    // marker
-  }, {
-    key: "addMarker",
-    value: function addMarker(marker) {
-      this.markerService.addMarker(marker);
-    }
-  }, {
-    key: "addMarkerLayer",
-    value: function addMarkerLayer(layer) {
-      this.markerService.addMarkerLayer(layer);
-    }
-  }, {
-    key: "removeMarkerLayer",
-    value: function removeMarkerLayer(layer) {
-      this.markerService.removeMarkerLayer(layer);
-    }
-  }, {
-    key: "removeAllMarkers",
-    value: function removeAllMarkers() {
-      this.markerService.removeAllMarkers();
-    }
-  }, {
-    key: "removeAllMakers",
-    value: function removeAllMakers() {
-      console.warn('removeAllMakers 已废弃，请使用 removeAllMarkers');
-      this.markerService.removeAllMarkers();
-    }
-  }, {
-    key: "addPopup",
-    value: function addPopup(popup) {
-      this.popupService.addPopup(popup);
-    }
-  }, {
-    key: "removePopup",
-    value: function removePopup(popup) {
-      this.popupService.removePopup(popup);
-    }
-  }, {
-    key: "on",
-    value: function on(type, handle) {
-      if (BoxSelectEventList.includes(type)) {
-        var _this$boxSelect;
-        (_this$boxSelect = this.boxSelect) === null || _this$boxSelect === void 0 || _this$boxSelect.on(type, handle);
-      } else if (SceneEventList.includes(type)) {
-        this.sceneService.on(type, handle);
-      } else {
-        this.mapService.on(type, handle);
-      }
-    }
-  }, {
-    key: "once",
-    value: function once(type, handle) {
-      if (BoxSelectEventList.includes(type)) {
-        var _this$boxSelect2;
-        (_this$boxSelect2 = this.boxSelect) === null || _this$boxSelect2 === void 0 || _this$boxSelect2.once(type, handle);
-      } else if (SceneEventList.includes(type)) {
-        this.sceneService.once(type, handle);
-      } else {
-        this.mapService.once(type, handle);
-      }
-    }
-  }, {
-    key: "emit",
-    value: function emit(type, handle) {
-      SceneEventList.indexOf(type) === -1 ? this.mapService.on(type, handle) : this.sceneService.emit(type, handle);
-    }
-  }, {
-    key: "off",
-    value: function off(type, handle) {
-      if (BoxSelectEventList.includes(type)) {
-        var _this$boxSelect3;
-        (_this$boxSelect3 = this.boxSelect) === null || _this$boxSelect3 === void 0 || _this$boxSelect3.off(type, handle);
-      } else if (SceneEventList.includes(type)) {
-        this.sceneService.off(type, handle);
-      } else {
-        this.mapService.off(type, handle);
-      }
-    }
-
-    // implements IMapController
-  }, {
-    key: "getZoom",
-    value: function getZoom() {
-      return this.mapService.getZoom();
-    }
-  }, {
-    key: "getCenter",
-    value: function getCenter(options) {
-      return this.mapService.getCenter(options);
-    }
-  }, {
-    key: "setCenter",
-    value: function setCenter(center, options) {
-      return this.mapService.setCenter(center, options);
-    }
-  }, {
-    key: "getPitch",
-    value: function getPitch() {
-      return this.mapService.getPitch();
-    }
-  }, {
-    key: "setPitch",
-    value: function setPitch(pitch) {
-      return this.mapService.setPitch(pitch);
-    }
-  }, {
-    key: "getRotation",
-    value: function getRotation() {
-      return this.mapService.getRotation();
-    }
-  }, {
-    key: "getBounds",
-    value: function getBounds() {
-      return this.mapService.getBounds();
-    }
-  }, {
-    key: "setRotation",
-    value: function setRotation(rotation) {
-      this.mapService.setRotation(rotation);
-    }
-  }, {
-    key: "zoomIn",
-    value: function zoomIn() {
-      this.mapService.zoomIn();
-    }
-  }, {
-    key: "zoomOut",
-    value: function zoomOut() {
-      this.mapService.zoomOut();
-    }
-  }, {
-    key: "panTo",
-    value: function panTo(p) {
-      this.mapService.panTo(p);
-    }
-  }, {
-    key: "panBy",
-    value: function panBy(x, y) {
-      this.mapService.panBy(x, y);
-    }
-  }, {
-    key: "getContainer",
-    value: function getContainer() {
-      return this.mapService.getContainer();
+  }
+  once(type, handle) {
+    var _a;
+    if (BoxSelectEventList.includes(type)) {
+      (_a = this.boxSelect) == null ? void 0 : _a.once(type, handle);
+    } else if (SceneEventList.includes(type)) {
+      this.sceneService.once(type, handle);
+    } else {
+      this.mapService.once(type, handle);
     }
-  }, {
-    key: "setZoom",
-    value: function setZoom(zoom) {
-      this.mapService.setZoom(zoom);
+  }
+  emit(type, handle) {
+    SceneEventList.indexOf(type) === -1 ? this.mapService.on(type, handle) : this.sceneService.emit(type, handle);
+  }
+  off(type, handle) {
+    var _a;
+    if (BoxSelectEventList.includes(type)) {
+      (_a = this.boxSelect) == null ? void 0 : _a.off(type, handle);
+    } else if (SceneEventList.includes(type)) {
+      this.sceneService.off(type, handle);
+    } else {
+      this.mapService.off(type, handle);
     }
-  }, {
-    key: "fitBounds",
-    value: function fitBounds(bound, options) {
-      var _this$sceneService$ge = this.sceneService.getSceneConfig(),
-        fitBoundsOptions = _this$sceneService$ge.fitBoundsOptions,
-        animate = _this$sceneService$ge.animate;
-      this.mapService.fitBounds(bound,
+  }
+  // implements IMapController
+  getZoom() {
+    return this.mapService.getZoom();
+  }
+  getCenter(options) {
+    return this.mapService.getCenter(options);
+  }
+  setCenter(center, options) {
+    return this.mapService.setCenter(center, options);
+  }
+  getPitch() {
+    return this.mapService.getPitch();
+  }
+  setPitch(pitch) {
+    return this.mapService.setPitch(pitch);
+  }
+  getRotation() {
+    return this.mapService.getRotation();
+  }
+  getBounds() {
+    return this.mapService.getBounds();
+  }
+  setRotation(rotation) {
+    this.mapService.setRotation(rotation);
+  }
+  zoomIn() {
+    this.mapService.zoomIn();
+  }
+  zoomOut() {
+    this.mapService.zoomOut();
+  }
+  panTo(p) {
+    this.mapService.panTo(p);
+  }
+  panBy(x, y) {
+    this.mapService.panBy(x, y);
+  }
+  getContainer() {
+    return this.mapService.getContainer();
+  }
+  setZoom(zoom) {
+    this.mapService.setZoom(zoom);
+  }
+  fitBounds(bound, options) {
+    const { fitBoundsOptions, animate } = this.sceneService.getSceneConfig();
+    this.mapService.fitBounds(
+      bound,
       // 选项优先级：用户传入，覆盖animate直接配置，覆盖Scene配置项传入
-      options || _objectSpread(_objectSpread({}, fitBoundsOptions), {}, {
-        animate: animate
-      }));
-    }
-  }, {
-    key: "setZoomAndCenter",
-    value: function setZoomAndCenter(zoom, center) {
-      this.mapService.setZoomAndCenter(zoom, center);
-    }
-  }, {
-    key: "setMapStyle",
-    value: function setMapStyle(style) {
-      this.mapService.setMapStyle(style);
-    }
-  }, {
-    key: "setMapStatus",
-    value: function setMapStatus(options) {
-      this.mapService.setMapStatus(options);
-    }
-
-    // conversion Method
-  }, {
-    key: "pixelToLngLat",
-    value: function pixelToLngLat(pixel) {
-      return this.mapService.pixelToLngLat(pixel);
-    }
-  }, {
-    key: "lngLatToPixel",
-    value: function lngLatToPixel(lnglat) {
-      return this.mapService.lngLatToPixel(lnglat);
-    }
-  }, {
-    key: "containerToLngLat",
-    value: function containerToLngLat(pixel) {
-      return this.mapService.containerToLngLat(pixel);
-    }
-  }, {
-    key: "lngLatToContainer",
-    value: function lngLatToContainer(lnglat) {
-      return this.mapService.lngLatToContainer(lnglat);
-    }
-  }, {
-    key: "destroy",
-    value: function destroy() {
-      this.sceneService.destroy();
-      // TODO: 清理其他 Service 例如 IconService
-    }
-  }, {
-    key: "registerPostProcessingPass",
-    value: function registerPostProcessingPass(constructor) {
-      this.container.postProcessingPass.name = new constructor();
-    }
-
-    // 控制 shader pick 计算
-  }, {
-    key: "enableShaderPick",
-    value: function enableShaderPick() {
-      this.layerService.enableShaderPick();
-    }
-  }, {
-    key: "diasbleShaderPick",
-    value: function diasbleShaderPick() {
-      this.layerService.disableShaderPick();
-    }
-  }, {
-    key: "enableBoxSelect",
-    value: function enableBoxSelect() {
-      var _this6 = this;
-      var once = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
-      this.boxSelect.enable();
-      if (once) {
-        this.boxSelect.once('selectend', function () {
-          _this6.disableBoxSelect();
-        });
-      }
-    }
-  }, {
-    key: "disableBoxSelect",
-    value: function disableBoxSelect() {
-      this.boxSelect.disable();
-    }
-
-    // 数据协议
-  }, {
-    key: "getProtocol",
-    value: function getProtocol(protocol) {
-      return SceneConifg.REGISTERED_PROTOCOLS[protocol];
-    }
-  }, {
-    key: "startAnimate",
-    value: function startAnimate() {
-      this.layerService.startAnimate();
-    }
-  }, {
-    key: "stopAnimate",
-    value: function stopAnimate() {
-      this.layerService.stopAnimate();
-    }
-
-    // get current point size info
-  }, {
-    key: "getPointSizeRange",
-    value: function getPointSizeRange() {
-      return this.sceneService.getPointSizeRange();
+      options || __spreadProps(__spreadValues({}, fitBoundsOptions), {
+        animate
+      })
+    );
+  }
+  setZoomAndCenter(zoom, center) {
+    this.mapService.setZoomAndCenter(zoom, center);
+  }
+  setMapStyle(style) {
+    this.mapService.setMapStyle(style);
+  }
+  setMapStatus(options) {
+    this.mapService.setMapStatus(options);
+  }
+  // conversion Method
+  pixelToLngLat(pixel) {
+    return this.mapService.pixelToLngLat(pixel);
+  }
+  lngLatToPixel(lnglat) {
+    return this.mapService.lngLatToPixel(lnglat);
+  }
+  containerToLngLat(pixel) {
+    return this.mapService.containerToLngLat(pixel);
+  }
+  lngLatToContainer(lnglat) {
+    return this.mapService.lngLatToContainer(lnglat);
+  }
+  destroy() {
+    this.sceneService.destroy();
+  }
+  registerPostProcessingPass(constructor) {
+    this.container.postProcessingPass.name = new constructor();
+  }
+  // 控制 shader pick 计算
+  enableShaderPick() {
+    this.layerService.enableShaderPick();
+  }
+  diasbleShaderPick() {
+    this.layerService.disableShaderPick();
+  }
+  enableBoxSelect(once = true) {
+    this.boxSelect.enable();
+    if (once) {
+      this.boxSelect.once("selectend", () => {
+        this.disableBoxSelect();
+      });
     }
-  }, {
-    key: "initComponent",
-    value: function initComponent(id) {
-      this.controlService.init({
+  }
+  disableBoxSelect() {
+    this.boxSelect.disable();
+  }
+  // 数据协议
+  static addProtocol(protocol, handler) {
+    SceneConifg.REGISTERED_PROTOCOLS[protocol] = handler;
+  }
+  static removeProtocol(protocol) {
+    delete SceneConifg.REGISTERED_PROTOCOLS[protocol];
+  }
+  getProtocol(protocol) {
+    return SceneConifg.REGISTERED_PROTOCOLS[protocol];
+  }
+  startAnimate() {
+    this.layerService.startAnimate();
+  }
+  stopAnimate() {
+    this.layerService.stopAnimate();
+  }
+  // get current point size info
+  getPointSizeRange() {
+    return this.sceneService.getPointSizeRange();
+  }
+  initComponent(id) {
+    this.controlService.init(
+      {
         container: DOM.getContainer(id)
-      }, this.container);
-      this.markerService.init(this.container);
-      this.popupService.init(this.container);
-    }
-  }, {
-    key: "initControl",
-    value: function initControl() {
-      var _this$sceneService$ge2 = this.sceneService.getSceneConfig(),
-        logoVisible = _this$sceneService$ge2.logoVisible,
-        logoPosition = _this$sceneService$ge2.logoPosition;
-      if (logoVisible) {
-        this.addControl(new Logo({
-          position: logoPosition
-        }));
-      }
-    }
-  }, {
-    key: "initTileLayer",
-    value: function initTileLayer(layer) {
-      if (layer.getSource().isTile) {
-        layer.tileLayer = new TileLayer(layer);
-        // Todo 支持瓦片更新
-      }
-    }
-  }], [{
-    key: "addProtocol",
-    value: function addProtocol(protocol, handler) {
-      SceneConifg.REGISTERED_PROTOCOLS[protocol] = handler;
+      },
+      this.container
+    );
+    this.markerService.init(this.container);
+    this.popupService.init(this.container);
+  }
+  initControl() {
+    const { logoVisible, logoPosition } = this.sceneService.getSceneConfig();
+    if (logoVisible) {
+      this.addControl(new Logo({ position: logoPosition }));
     }
-  }, {
-    key: "removeProtocol",
-    value: function removeProtocol(protocol) {
-      delete SceneConifg.REGISTERED_PROTOCOLS[protocol];
+  }
+  initTileLayer(layer) {
+    if (layer.getSource().isTile) {
+      layer.tileLayer = new TileLayer(layer);
     }
-  }]);
-  return Scene;
-}();
-export { Scene };
+  }
+};
+export {
+  Scene
+};