@antv/l7-core - npm Package Compare versions

Comparing version 2.20.14 to 2.20.15

es/services/interaction/InteractionService.d.ts

@@ -24,3 +24,2 @@ import EventEmitter from 'eventemitter3';
     triggerActive(id: number): void;
-    handleMiniEvent(e: any): void;
     private addEventListenerOnMap;
@@ -31,2 +30,4 @@ private removeEventListenerOnMap;
     private onTouch;
+    private onTouchEnd;
+    private onTouchMove;
     private interactionEvent;
@@ -33,0 +34,0 @@ private onHover;

es/services/interaction/InteractionService.js

@@ -65,7 +65,28 @@ import _initializerDefineProperty from "@babel/runtime/helpers/esm/initializerDefineProperty";
       _this.onHover({
-        x: touch.pageX,
-        y: touch.pageY,
-        type: 'touch'
+        clientX: touch.clientX,
+        clientY: touch.clientY,
+        type: 'touchstart'
       });
     });
+    _defineProperty(_assertThisInitialized(_this), "onTouchEnd", function (target) {
+      if (target.changedTouches.length > 0) {
+        var touch = target.changedTouches[0];
+        // @ts-ignore
+        _this.onHover({
+          clientX: touch.clientX,
+          clientY: touch.clientY,
+          type: 'touchend'
+        });
+      }
+    });
+    // touch move == drag map 目前会被拦截
+    _defineProperty(_assertThisInitialized(_this), "onTouchMove", function (target) {
+      var touch = target.changedTouches[0];
+      // @ts-ignore
+      _this.onHover({
+        clientX: touch.clientX,
+        clientY: touch.clientY,
+        type: 'touchmove'
+      });
+    });
     _defineProperty(_assertThisInitialized(_this), "onHover", function (event) {
@@ -147,12 +168,2 @@ var clientX = event.clientX,
   }, {
-    key: "handleMiniEvent",
-    value: function handleMiniEvent(e) {
-      // @ts-ignore
-      this.onHover({
-        clientX: e.touches[0].pageX,
-        clientY: e.touches[0].pageY,
-        type: 'touch'
-      });
-    }
-  }, {
     key: "addEventListenerOnMap",
@@ -181,4 +192,5 @@ value: function addEventListenerOnMap() {
         hammertime.on('panstart panmove panend pancancel', this.onDrag);
-        // $containter.addEventListener('touchstart', this.onTouch);
-        $containter.addEventListener('mousemove', this.onHover);
+        $containter.addEventListener('touchstart', this.onTouch);
+        $containter.addEventListener('touchend', this.onTouchEnd);
+        $containter.addEventListener('touchmove', this.onTouchMove);
         // $containter.addEventListener('click', this.onHover);
@@ -201,4 +213,4 @@ $containter.addEventListener('mousedown', this.onHover, true);
         this.hammertime.off('panstart panmove panend pancancel', this.onDrag);
-        // $containter.removeEventListener('touchstart', this.onTouch);
-        // $containter.removeEventListener('click', this.onHover);
+        $containter.removeEventListener('touchstart', this.onTouch);
+        $containter.removeEventListener('touchend', this.onTouchEnd);
         $containter.removeEventListener('mousedown', this.onHover);
@@ -205,0 +217,0 @@ $containter.removeEventListener('mouseup', this.onHover);

es/services/interaction/PickingService.js

@@ -88,2 +88,3 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
                 if (!rawFeature) {
+
                   // this.logger.error(
@@ -364,2 +365,3 @@ //   '未找到颜色编码解码后的原始 feature，请检查 fragment shader 中末尾是否添加了 `gl_FragColor = filterColor(gl_FragColor);`',
       // this.alreadyInPicking 避免多次重复拾取
+
       if (this.alreadyInPicking) {
@@ -376,2 +378,3 @@ return false;
       }
+
       // 判断当前进行 shader pick 拾取判断
@@ -378,0 +381,0 @@ if (!this.layerService.getShaderPickStat()) {

es/services/scene/ISceneService.d.ts

@@ -9,3 +9,2 @@ import type EventEmitter from 'eventemitter3';
     init(config: ISceneConfig): void;
-    initMiniScene(config: ISceneConfig): void;
     addLayer(layer: ILayer): void;
@@ -12,0 +11,0 @@ addMask(mask: ILayer): void;

es/services/scene/SceneService.d.ts

@@ -35,3 +35,2 @@ import { EventEmitter } from 'eventemitter3';
     private inited;
-    private initPromise;
     private rendering;
@@ -44,2 +43,3 @@ /**
     private markerContainer;
+    private resizeDetector;
     private hooks;
@@ -49,7 +49,2 @@ constructor();
     private registerContextLost;
-    /**
-     * 小程序环境下初始化 Scene
-     * @param sceneConfig
-     */
-    initMiniScene(sceneConfig: ISceneConfig): void;
     addLayer(layer: ILayer): void;
@@ -56,0 +51,0 @@ addMask(mask: ILayer): void;

es/services/scene/SceneService.js

@@ -19,3 +19,3 @@ import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import { DOM } from '@antv/l7-utils';
-import elementResizeEvent, { unbind } from 'element-resize-event';
+import elementResizeDetectorMaker from "element-resize-detector";
 import { EventEmitter } from 'eventemitter3';
@@ -63,3 +63,2 @@ import { inject, injectable } from 'inversify';
     _defineProperty(_assertThisInitialized(_this), "inited", false);
-    _defineProperty(_assertThisInitialized(_this), "initPromise", void 0);
     // TODO: 改成状态机
@@ -73,2 +72,3 @@ _defineProperty(_assertThisInitialized(_this), "rendering", false);
     _defineProperty(_assertThisInitialized(_this), "markerContainer", void 0);
+    _defineProperty(_assertThisInitialized(_this), "resizeDetector", void 0);
     _defineProperty(_assertThisInitialized(_this), "hooks", void 0);
@@ -80,5 +80,5 @@ _defineProperty(_assertThisInitialized(_this), "handleWindowResized", function () {
         _this.initContainer();
-        DOM.triggerResize();
+        // 触发 Map， canvas
+        // DOM.triggerResize();
         _this.coordinateSystemService.needRefresh = true;
-
         //  repaint layers
@@ -176,3 +176,3 @@ _this.render();
               if (!_this2.$container) {
-                _context2.next = 13;
+                _context2.next = 14;
                 break;
@@ -189,13 +189,17 @@ }
               _this2.initContainer();
-              elementResizeEvent(_this2.$container, _this2.handleWindowResized);
+              _this2.resizeDetector = elementResizeDetectorMaker({
+                strategy: "scroll" //<- For ultra performance.
+              });
+
+              _this2.resizeDetector.listenTo(_this2.$container, _this2.handleWindowResized);
               if (window.matchMedia) {
-                (_window$matchMedia = window.matchMedia('screen and (-webkit-min-device-pixel-ratio: 1.5)')) === null || _window$matchMedia === void 0 || _window$matchMedia.addListener(_this2.handleWindowResized);
+                (_window$matchMedia = window.matchMedia('screen and (-webkit-min-device-pixel-ratio: 1.5)')) === null || _window$matchMedia === void 0 || _window$matchMedia.addListener(_this2.handleWindowResized.bind('screen'));
               }
-              _context2.next = 14;
+              _context2.next = 15;
               break;
-            case 13:
+            case 14:
               console.error('容器 id 不存在');
-            case 14:
+            case 15:
               _this2.pickingService.init(_this2.id);
-            case 15:
+            case 16:
             case "end":
@@ -219,99 +223,3 @@ return _context2.stop();
     }
-
-    /**
-     * 小程序环境下初始化 Scene
-     * @param sceneConfig
-     */
   }, {
-    key: "initMiniScene",
-    value: function initMiniScene(sceneConfig) {
-      var _this4 = this;
-      // 设置场景配置项
-      this.configService.setSceneConfig(this.id, sceneConfig);
-
-      // 初始化 ShaderModule
-      this.shaderModuleService.registerBuiltinModules();
-
-      // 初始化资源管理 图片
-      this.iconService.init();
-      this.iconService.on('imageUpdate', function () {
-        return _this4.render();
-      });
-      // 字体资源
-      this.fontService.init();
-
-      /**
-       * 初始化底图
-       */
-      this.hooks.init.tapPromise('initMap', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
-        return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-          while (1) switch (_context3.prev = _context3.next) {
-            case 0:
-              _context3.next = 2;
-              return new Promise(function (resolve) {
-                _this4.map.onCameraChanged(function (viewport) {
-                  _this4.cameraService.init();
-                  _this4.cameraService.update(viewport);
-                  if (_this4.map.version !== 'GAODE2.x') {
-                    // not amap2
-                    resolve();
-                  }
-                });
-                // @ts-ignore
-                _this4.map.initMiniMap();
-              });
-            case 2:
-              // 重新绑定非首次相机更新事件
-              _this4.map.onCameraChanged(_this4.handleMapCameraChanged);
-
-              // 地图初始化之后 才能初始化 container 上的交互
-              _this4.interactionService.init();
-              _this4.interactionService.on(InteractionEvent.Drag, _this4.addSceneEvent.bind(_this4));
-            case 5:
-            case "end":
-              return _context3.stop();
-          }
-        }, _callee3);
-      })));
-
-      /**
-       * 初始化渲染引擎
-       */
-      this.hooks.init.tapPromise('initRenderer', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
-        var $container;
-        return _regeneratorRuntime.wrap(function _callee4$(_context4) {
-          while (1) switch (_context4.prev = _context4.next) {
-            case 0:
-              // 创建底图之上的 container
-              $container = sceneConfig.canvas; // 添加marker container;
-              _this4.$container = $container ? $container : null;
-              if (!_this4.$container) {
-                _context4.next = 7;
-                break;
-              }
-              _context4.next = 5;
-              return _this4.rendererService.init(
-              // @ts-ignore
-              sceneConfig.canvas, _this4.configService.getSceneConfig(_this4.id), undefined);
-            case 5:
-              _context4.next = 8;
-              break;
-            case 7:
-              console.error('容器 id 不存在');
-            case 8:
-              _this4.pickingService.init(_this4.id);
-            case 9:
-            case "end":
-              return _context4.stop();
-          }
-        }, _callee4);
-      })));
-      // TODO：init worker, fontAtlas...
-
-      // 执行异步并行初始化任务
-      // @ts-ignore
-      this.initPromise = this.hooks.init.promise();
-      this.render();
-    }
-  }, {
     key: "addLayer",
@@ -331,11 +239,11 @@ value: function addLayer(layer) {
     value: function () {
-      var _render = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
-        return _regeneratorRuntime.wrap(function _callee5$(_context5) {
-          while (1) switch (_context5.prev = _context5.next) {
+      var _render = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
+        return _regeneratorRuntime.wrap(function _callee3$(_context3) {
+          while (1) switch (_context3.prev = _context3.next) {
             case 0:
               if (!(this.rendering || this.destroyed)) {
-                _context5.next = 2;
+                _context3.next = 2;
                 break;
               }
-              return _context5.abrupt("return");
+              return _context3.abrupt("return");
             case 2:
@@ -345,6 +253,6 @@ this.rendering = true;
               if (this.inited) {
-                _context5.next = 16;
+                _context3.next = 16;
                 break;
               }
-              _context5.next = 6;
+              _context3.next = 6;
               return this.hooks.init.promise();
@@ -357,3 +265,3 @@ case 6:
               // FIXME: 初始化 marker 容器，可以放到 map 初始化方法中？
-              _context5.next = 9;
+              _context3.next = 9;
               return this.layerService.initLayers();
@@ -366,9 +274,9 @@ case 9:
               this.inited = true;
-              _context5.next = 20;
+              _context3.next = 20;
               break;
             case 16:
-              _context5.next = 18;
+              _context3.next = 18;
               return this.layerService.initLayers();
             case 18:
-              _context5.next = 20;
+              _context3.next = 20;
               return this.layerService.renderLayers();
@@ -380,5 +288,5 @@ case 20:
             case "end":
-              return _context5.stop();
+              return _context3.stop();
           }
-        }, _callee5, this);
+        }, _callee3, this);
       }));
@@ -408,19 +316,19 @@ function render() {
     value: function () {
-      var _exportPng = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6(type) {
+      var _exportPng = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4(type) {
         var _this$$container;
         var renderCanvas, layersPng;
-        return _regeneratorRuntime.wrap(function _callee6$(_context6) {
-          while (1) switch (_context6.prev = _context6.next) {
+        return _regeneratorRuntime.wrap(function _callee4$(_context4) {
+          while (1) switch (_context4.prev = _context4.next) {
             case 0:
               renderCanvas = (_this$$container = this.$container) === null || _this$$container === void 0 ? void 0 : _this$$container.getElementsByTagName('canvas')[0];
-              _context6.next = 3;
+              _context4.next = 3;
               return this.render();
             case 3:
               layersPng = type === 'jpg' ? renderCanvas === null || renderCanvas === void 0 ? void 0 : renderCanvas.toDataURL('image/jpeg') : renderCanvas === null || renderCanvas === void 0 ? void 0 : renderCanvas.toDataURL('image/png');
-              return _context6.abrupt("return", layersPng);
+              return _context4.abrupt("return", layersPng);
             case 5:
             case "end":
-              return _context6.stop();
+              return _context4.stop();
           }
-        }, _callee6, this);
+        }, _callee4, this);
       }));
@@ -461,3 +369,3 @@ function exportPng(_x) {
     value: function destroy() {
-      var _this5 = this,
+      var _this4 = this,
         _this$$container2;
@@ -468,7 +376,3 @@ if (!this.inited) {
       }
-      unbind(this.$container, this.handleWindowResized);
-      if (window.matchMedia) {
-        var _window$matchMedia2;
-        (_window$matchMedia2 = window.matchMedia('screen and (min-resolution: 2dppx)')) === null || _window$matchMedia2 === void 0 || _window$matchMedia2.removeListener(this.handleWindowResized);
-      }
+      this.resizeDetector.removeListener(this.$container, this.handleWindowResized);
       this.pickingService.destroy();
@@ -488,9 +392,9 @@ this.layerService.destroy();
       setTimeout(function () {
-        var _this5$$container;
-        (_this5$$container = _this5.$container) === null || _this5$$container === void 0 || _this5$$container.removeChild(_this5.canvas);
+        var _this4$$container;
+        (_this4$$container = _this4.$container) === null || _this4$$container === void 0 || _this4$$container.removeChild(_this4.canvas);
         // this.canvas = null 清除对 webgl 实例的引用
         // @ts-ignore
-        _this5.canvas = null;
+        _this4.canvas = null;
         // Tip: 把这一部分销毁放到写下一个事件循环中执行，兼容 L7React 中 scene 和 layer 同时销毁的情况
-        _this5.rendererService.destroy();
+        _this4.rendererService.destroy();
       });
@@ -512,6 +416,3 @@ // 销毁 container 容器
         canvas.height = h * pixelRatio;
-        // canvas.style.width = `${w}px`;
-        // canvas.style.height = `${h}px`;
       }
-
       this.rendererService.viewport({
@@ -534,4 +435,2 @@ x: 0,
       canvas.height = h * pixelRatio;
-      // canvas.style.width = `${w}px`;
-      // canvas.style.height = `${h}px`;
       canvas.style.width = '100%';
@@ -538,0 +437,0 @@ canvas.style.height = '100%';

lib/services/interaction/InteractionService.js

@@ -71,7 +71,28 @@ "use strict";
       _this.onHover({
-        x: touch.pageX,
-        y: touch.pageY,
-        type: 'touch'
+        clientX: touch.clientX,
+        clientY: touch.clientY,
+        type: 'touchstart'
       });
     });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onTouchEnd", function (target) {
+      if (target.changedTouches.length > 0) {
+        var touch = target.changedTouches[0];
+        // @ts-ignore
+        _this.onHover({
+          clientX: touch.clientX,
+          clientY: touch.clientY,
+          type: 'touchend'
+        });
+      }
+    });
+    // touch move == drag map 目前会被拦截
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onTouchMove", function (target) {
+      var touch = target.changedTouches[0];
+      // @ts-ignore
+      _this.onHover({
+        clientX: touch.clientX,
+        clientY: touch.clientY,
+        type: 'touchmove'
+      });
+    });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onHover", function (event) {
@@ -153,12 +174,2 @@ var clientX = event.clientX,
   }, {
-    key: "handleMiniEvent",
-    value: function handleMiniEvent(e) {
-      // @ts-ignore
-      this.onHover({
-        clientX: e.touches[0].pageX,
-        clientY: e.touches[0].pageY,
-        type: 'touch'
-      });
-    }
-  }, {
     key: "addEventListenerOnMap",
@@ -187,4 +198,5 @@ value: function addEventListenerOnMap() {
         hammertime.on('panstart panmove panend pancancel', this.onDrag);
-        // $containter.addEventListener('touchstart', this.onTouch);
-        $containter.addEventListener('mousemove', this.onHover);
+        $containter.addEventListener('touchstart', this.onTouch);
+        $containter.addEventListener('touchend', this.onTouchEnd);
+        $containter.addEventListener('touchmove', this.onTouchMove);
         // $containter.addEventListener('click', this.onHover);
@@ -207,4 +219,4 @@ $containter.addEventListener('mousedown', this.onHover, true);
         this.hammertime.off('panstart panmove panend pancancel', this.onDrag);
-        // $containter.removeEventListener('touchstart', this.onTouch);
-        // $containter.removeEventListener('click', this.onHover);
+        $containter.removeEventListener('touchstart', this.onTouch);
+        $containter.removeEventListener('touchend', this.onTouchEnd);
         $containter.removeEventListener('mousedown', this.onHover);
@@ -211,0 +223,0 @@ $containter.removeEventListener('mouseup', this.onHover);

lib/services/interaction/PickingService.js

@@ -95,2 +95,3 @@ "use strict";
                 if (!rawFeature) {
+
                   // this.logger.error(
@@ -371,2 +372,3 @@ //   '未找到颜色编码解码后的原始 feature，请检查 fragment shader 中末尾是否添加了 `gl_FragColor = filterColor(gl_FragColor);`',
       // this.alreadyInPicking 避免多次重复拾取
+
       if (this.alreadyInPicking) {
@@ -383,2 +385,3 @@ return false;
       }
+
       // 判断当前进行 shader pick 拾取判断
@@ -385,0 +388,0 @@ if (!this.layerService.getShaderPickStat()) {

lib/services/scene/SceneService.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
@@ -23,3 +22,3 @@ value: true
 var _l7Utils = require("@antv/l7-utils");
-var _elementResizeEvent = _interopRequireWildcard(require("element-resize-event"));
+var _elementResizeDetector = _interopRequireDefault(require("element-resize-detector"));
 var _eventemitter = require("eventemitter3");
@@ -32,4 +31,2 @@ var _inversify = require("inversify");
 var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _dec7, _dec8, _dec9, _dec10, _dec11, _dec12, _dec13, _dec14, _dec15, _dec16, _dec17, _class, _class2, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5, _descriptor6, _descriptor7, _descriptor8, _descriptor9, _descriptor10, _descriptor11, _descriptor12, _descriptor13, _descriptor14, _descriptor15, _descriptor16; // @ts-ignore
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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); }; }
@@ -73,3 +70,2 @@ 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; } }
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "inited", false);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "initPromise", void 0);
     // TODO: 改成状态机
@@ -83,2 +79,3 @@ (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "rendering", false);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "markerContainer", void 0);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "resizeDetector", void 0);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "hooks", void 0);
@@ -90,5 +87,5 @@ (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleWindowResized", function () {
         _this.initContainer();
-        _l7Utils.DOM.triggerResize();
+        // 触发 Map， canvas
+        // DOM.triggerResize();
         _this.coordinateSystemService.needRefresh = true;
-
         //  repaint layers
@@ -186,3 +183,3 @@ _this.render();
               if (!_this2.$container) {
-                _context2.next = 13;
+                _context2.next = 14;
                 break;
@@ -199,13 +196,17 @@ }
               _this2.initContainer();
-              (0, _elementResizeEvent.default)(_this2.$container, _this2.handleWindowResized);
+              _this2.resizeDetector = (0, _elementResizeDetector.default)({
+                strategy: "scroll" //<- For ultra performance.
+              });
+
+              _this2.resizeDetector.listenTo(_this2.$container, _this2.handleWindowResized);
               if (window.matchMedia) {
-                (_window$matchMedia = window.matchMedia('screen and (-webkit-min-device-pixel-ratio: 1.5)')) === null || _window$matchMedia === void 0 || _window$matchMedia.addListener(_this2.handleWindowResized);
+                (_window$matchMedia = window.matchMedia('screen and (-webkit-min-device-pixel-ratio: 1.5)')) === null || _window$matchMedia === void 0 || _window$matchMedia.addListener(_this2.handleWindowResized.bind('screen'));
               }
-              _context2.next = 14;
+              _context2.next = 15;
               break;
-            case 13:
+            case 14:
               console.error('容器 id 不存在');
-            case 14:
+            case 15:
               _this2.pickingService.init(_this2.id);
-            case 15:
+            case 16:
             case "end":
@@ -229,99 +230,3 @@ return _context2.stop();
     }
-
-    /**
-     * 小程序环境下初始化 Scene
-     * @param sceneConfig
-     */
   }, {
-    key: "initMiniScene",
-    value: function initMiniScene(sceneConfig) {
-      var _this4 = this;
-      // 设置场景配置项
-      this.configService.setSceneConfig(this.id, sceneConfig);
-
-      // 初始化 ShaderModule
-      this.shaderModuleService.registerBuiltinModules();
-
-      // 初始化资源管理 图片
-      this.iconService.init();
-      this.iconService.on('imageUpdate', function () {
-        return _this4.render();
-      });
-      // 字体资源
-      this.fontService.init();
-
-      /**
-       * 初始化底图
-       */
-      this.hooks.init.tapPromise('initMap', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3() {
-        return _regenerator.default.wrap(function _callee3$(_context3) {
-          while (1) switch (_context3.prev = _context3.next) {
-            case 0:
-              _context3.next = 2;
-              return new Promise(function (resolve) {
-                _this4.map.onCameraChanged(function (viewport) {
-                  _this4.cameraService.init();
-                  _this4.cameraService.update(viewport);
-                  if (_this4.map.version !== 'GAODE2.x') {
-                    // not amap2
-                    resolve();
-                  }
-                });
-                // @ts-ignore
-                _this4.map.initMiniMap();
-              });
-            case 2:
-              // 重新绑定非首次相机更新事件
-              _this4.map.onCameraChanged(_this4.handleMapCameraChanged);
-
-              // 地图初始化之后 才能初始化 container 上的交互
-              _this4.interactionService.init();
-              _this4.interactionService.on(_IInteractionService.InteractionEvent.Drag, _this4.addSceneEvent.bind(_this4));
-            case 5:
-            case "end":
-              return _context3.stop();
-          }
-        }, _callee3);
-      })));
-
-      /**
-       * 初始化渲染引擎
-       */
-      this.hooks.init.tapPromise('initRenderer', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4() {
-        var $container;
-        return _regenerator.default.wrap(function _callee4$(_context4) {
-          while (1) switch (_context4.prev = _context4.next) {
-            case 0:
-              // 创建底图之上的 container
-              $container = sceneConfig.canvas; // 添加marker container;
-              _this4.$container = $container ? $container : null;
-              if (!_this4.$container) {
-                _context4.next = 7;
-                break;
-              }
-              _context4.next = 5;
-              return _this4.rendererService.init(
-              // @ts-ignore
-              sceneConfig.canvas, _this4.configService.getSceneConfig(_this4.id), undefined);
-            case 5:
-              _context4.next = 8;
-              break;
-            case 7:
-              console.error('容器 id 不存在');
-            case 8:
-              _this4.pickingService.init(_this4.id);
-            case 9:
-            case "end":
-              return _context4.stop();
-          }
-        }, _callee4);
-      })));
-      // TODO：init worker, fontAtlas...
-
-      // 执行异步并行初始化任务
-      // @ts-ignore
-      this.initPromise = this.hooks.init.promise();
-      this.render();
-    }
-  }, {
     key: "addLayer",
@@ -341,11 +246,11 @@ value: function addLayer(layer) {
     value: function () {
-      var _render = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee5() {
-        return _regenerator.default.wrap(function _callee5$(_context5) {
-          while (1) switch (_context5.prev = _context5.next) {
+      var _render = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3() {
+        return _regenerator.default.wrap(function _callee3$(_context3) {
+          while (1) switch (_context3.prev = _context3.next) {
             case 0:
               if (!(this.rendering || this.destroyed)) {
-                _context5.next = 2;
+                _context3.next = 2;
                 break;
               }
-              return _context5.abrupt("return");
+              return _context3.abrupt("return");
             case 2:
@@ -355,6 +260,6 @@ this.rendering = true;
               if (this.inited) {
-                _context5.next = 16;
+                _context3.next = 16;
                 break;
               }
-              _context5.next = 6;
+              _context3.next = 6;
               return this.hooks.init.promise();
@@ -367,3 +272,3 @@ case 6:
               // FIXME: 初始化 marker 容器，可以放到 map 初始化方法中？
-              _context5.next = 9;
+              _context3.next = 9;
               return this.layerService.initLayers();
@@ -376,9 +281,9 @@ case 9:
               this.inited = true;
-              _context5.next = 20;
+              _context3.next = 20;
               break;
             case 16:
-              _context5.next = 18;
+              _context3.next = 18;
               return this.layerService.initLayers();
             case 18:
-              _context5.next = 20;
+              _context3.next = 20;
               return this.layerService.renderLayers();
@@ -390,5 +295,5 @@ case 20:
             case "end":
-              return _context5.stop();
+              return _context3.stop();
           }
-        }, _callee5, this);
+        }, _callee3, this);
       }));
@@ -418,19 +323,19 @@ function render() {
     value: function () {
-      var _exportPng = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee6(type) {
+      var _exportPng = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4(type) {
         var _this$$container;
         var renderCanvas, layersPng;
-        return _regenerator.default.wrap(function _callee6$(_context6) {
-          while (1) switch (_context6.prev = _context6.next) {
+        return _regenerator.default.wrap(function _callee4$(_context4) {
+          while (1) switch (_context4.prev = _context4.next) {
             case 0:
               renderCanvas = (_this$$container = this.$container) === null || _this$$container === void 0 ? void 0 : _this$$container.getElementsByTagName('canvas')[0];
-              _context6.next = 3;
+              _context4.next = 3;
               return this.render();
             case 3:
               layersPng = type === 'jpg' ? renderCanvas === null || renderCanvas === void 0 ? void 0 : renderCanvas.toDataURL('image/jpeg') : renderCanvas === null || renderCanvas === void 0 ? void 0 : renderCanvas.toDataURL('image/png');
-              return _context6.abrupt("return", layersPng);
+              return _context4.abrupt("return", layersPng);
             case 5:
             case "end":
-              return _context6.stop();
+              return _context4.stop();
           }
-        }, _callee6, this);
+        }, _callee4, this);
       }));
@@ -471,3 +376,3 @@ function exportPng(_x) {
     value: function destroy() {
-      var _this5 = this,
+      var _this4 = this,
         _this$$container2;
@@ -478,7 +383,3 @@ if (!this.inited) {
       }
-      (0, _elementResizeEvent.unbind)(this.$container, this.handleWindowResized);
-      if (window.matchMedia) {
-        var _window$matchMedia2;
-        (_window$matchMedia2 = window.matchMedia('screen and (min-resolution: 2dppx)')) === null || _window$matchMedia2 === void 0 || _window$matchMedia2.removeListener(this.handleWindowResized);
-      }
+      this.resizeDetector.removeListener(this.$container, this.handleWindowResized);
       this.pickingService.destroy();
@@ -498,9 +399,9 @@ this.layerService.destroy();
       setTimeout(function () {
-        var _this5$$container;
-        (_this5$$container = _this5.$container) === null || _this5$$container === void 0 || _this5$$container.removeChild(_this5.canvas);
+        var _this4$$container;
+        (_this4$$container = _this4.$container) === null || _this4$$container === void 0 || _this4$$container.removeChild(_this4.canvas);
         // this.canvas = null 清除对 webgl 实例的引用
         // @ts-ignore
-        _this5.canvas = null;
+        _this4.canvas = null;
         // Tip: 把这一部分销毁放到写下一个事件循环中执行，兼容 L7React 中 scene 和 layer 同时销毁的情况
-        _this5.rendererService.destroy();
+        _this4.rendererService.destroy();
       });
@@ -522,6 +423,3 @@ // 销毁 container 容器
         canvas.height = h * pixelRatio;
-        // canvas.style.width = `${w}px`;
-        // canvas.style.height = `${h}px`;
       }
-
       this.rendererService.viewport({
@@ -544,4 +442,2 @@ x: 0,
       canvas.height = h * pixelRatio;
-      // canvas.style.width = `${w}px`;
-      // canvas.style.height = `${h}px`;
       canvas.style.width = '100%';
@@ -548,0 +444,0 @@ canvas.style.height = '100%';

package.json

 {
   "name": "@antv/l7-core",
-  "version": "2.20.14",
+  "version": "2.20.15",
   "description": "",
@@ -28,3 +28,3 @@ "main": "lib/index.js",
     "@antv/async-hook": "^2.2.9",
-    "@antv/l7-utils": "2.20.14",
+    "@antv/l7-utils": "2.20.15",
     "@babel/runtime": "^7.7.7",
@@ -34,3 +34,3 @@ "@mapbox/tiny-sdf": "^1.2.5",
     "ajv": "^6.10.2",
-    "element-resize-event": "^3.0.3",
+    "element-resize-detector": "^1.2.4",
     "eventemitter3": "^4.0.0",
@@ -45,3 +45,3 @@ "gl-matrix": "^3.1.0",
   "devDependencies": {
-    "@types/element-resize-event": "^2.0.0",
+    "@types/element-resize-detector": "^1.1.6",
     "@types/gl-matrix": "^2.4.5",
@@ -53,3 +53,3 @@ "@types/hammerjs": "^2.0.36",
   },
-  "gitHead": "ad997ac14616fa503fec4022f1a1a48747524f87",
+  "gitHead": "283c12854a06cd2181552d6a9cf00d3e34bbd58e",
   "publishConfig": {
@@ -56,0 +56,0 @@ "access": "public"

No alert changes

Worsened metrics

Total package byte prevSize

988846

decreased by-0.71%

Lines of code

20823

decreased by-0.81%

Dependency changes

• + Addedelement-resize-detector@^1.2.4

• + Added@antv/l7-utils@2.20.15(transitive)

• + Addedbatch-processor@1.0.0(transitive)

• + Addedelement-resize-detector@1.2.4(transitive)

• - Removedelement-resize-event@^3.0.3

• - Removed@antv/l7-utils@2.20.14(transitive)

• - Removedelement-resize-event@3.0.6(transitive)

• Updated@antv/l7-utils@2.20.15