@antv/l7-layers 2.10.6 → 2.10.7

package/es/core/BaseLayer.js

@@ -1,5 +1,5 @@
-import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _initializerDefineProperty from "@babel/runtime/helpers/esm/initializerDefineProperty";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
@@ -29,17 +29,19 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 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; } }
 
 // @ts-ignore
-import { SyncBailHook, SyncHook, SyncWaterfallHook } from '@antv/async-hook';
+import { AsyncSeriesBailHook, AsyncWaterfallHook, SyncBailHook, SyncHook } from '@antv/async-hook';
 import { BlendType, lazyInject, TYPES } from '@antv/l7-core';
 import Source from '@antv/l7-source';
 import { encodePickingColor, WorkerSourceMap } from '@antv/l7-utils';
 import { EventEmitter } from 'eventemitter3';
 import { isFunction, isObject, isUndefined } from 'lodash';
 import { BlendTypes } from "../utils/blend";
-import { handleStyleDataMapping } from "../utils/dataMappingStyle";
+import { styleDataMapping } from "../utils/dataMappingStyle";
 import { calculateData } from "../utils/layerData";
 import { createMultiPassRenderer, normalizePasses } from "../utils/multiPassRender";
 import { updateShape } from "../utils/updateShape";
+import LayerPickService from "./LayerPickService";
+import TextureService from "./TextureService";
 /**
  * 分配 layer id
  */
@@ -53,12 +55,10 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
   // 生命周期钩子
   // 待渲染 model 列表
   // 用于保存子图层对象
-  // Tip: 用于标识矢量图层
 
   /**
    * 待更新样式属性，在初始化阶段完成注册
    */
-  // Tip: layer 保底颜色
   // private pickingPassRender: IPass<'pixelPicking'>;
   function BaseLayer() {
     var _this;
@@ -109,10 +109,10 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
     });
 
     _defineProperty(_assertThisInitialized(_this), "hooks", {
-      init: new SyncBailHook(),
+      init: new AsyncSeriesBailHook(),
       afterInit: new SyncBailHook(),
       beforeRender: new SyncBailHook(),
-      beforeRenderData: new SyncWaterfallHook(),
+      beforeRenderData: new AsyncWaterfallHook(),
       afterRender: new SyncHook(),
       beforePickingEncode: new SyncHook(),
       afterPickingEncode: new SyncHook(),
@@ -126,14 +126,12 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
 
     _defineProperty(_assertThisInitialized(_this), "models", []);
 
-    _defineProperty(_assertThisInitialized(_this), "modelLoaded", false);
+    _defineProperty(_assertThisInitialized(_this), "startInit", false);
 
     _defineProperty(_assertThisInitialized(_this), "layerChildren", []);
 
     _defineProperty(_assertThisInitialized(_this), "masks", []);
 
-    _defineProperty(_assertThisInitialized(_this), "isVector", false);
-
     _initializerDefineProperty(_assertThisInitialized(_this), "configService", _descriptor, _assertThisInitialized(_this));
 
     _defineProperty(_assertThisInitialized(_this), "animateOptions", {
@@ -148,8 +146,6 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
 
     _defineProperty(_assertThisInitialized(_this), "animateStatus", false);
 
-    _defineProperty(_assertThisInitialized(_this), "bottomColor", 'rgba(0, 0, 0, 0)');
-
     _defineProperty(_assertThisInitialized(_this), "isDestroyed", false);
 
     _defineProperty(_assertThisInitialized(_this), "encodeDataLength", 0);
@@ -163,12 +159,17 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
         _this.fitBounds(layerConfig.fitBoundsOptions);
       }
 
-      _this.reRender();
+      var autoRender = _this.layerSource.getSourceCfg().autoRender;
+
+      if (autoRender) {
+        _this.reRender();
+      }
     });
 
     _this.name = config.name || _this.id;
     _this.zIndex = config.zIndex || 0;
-    _this.rawConfig = config;
+    _this.rawConfig = config; // this.parent = this;
+
     return _this;
   }
 
@@ -211,12 +212,12 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
         }
       });
 
-      if (!this.inited) {
+      if (!this.startInit) {
         this.needUpdateConfig = _objectSpread(_objectSpread({}, this.needUpdateConfig), configToUpdate);
       } else {
         var sceneId = this.container.get(TYPES.SceneID); // @ts-ignore
 
-        handleStyleDataMapping(configToUpdate, this); // 处理 style 中进行数据映射的属性字段
+        styleDataMapping(configToUpdate, this); // 处理 style 中进行数据映射的属性字段
 
         this.configService.setLayerConfig(sceneId, this.id, _objectSpread(_objectSpread(_objectSpread({}, this.configService.getLayerConfig(this.id)), this.needUpdateConfig), configToUpdate));
         this.needUpdateConfig = {};
@@ -240,16 +241,6 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
     value: function getContainer() {
       return this.container;
     }
-  }, {
-    key: "setBottomColor",
-    value: function setBottomColor(color) {
-      this.bottomColor = color;
-    }
-  }, {
-    key: "getBottomColor",
-    value: function getBottomColor() {
-      return this.bottomColor;
-    }
   }, {
     key: "addPlugin",
     value: function addPlugin(plugin) {
@@ -258,105 +249,133 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
     }
   }, {
     key: "init",
-    value: function init() {
-      var _this3 = this;
-
-      // 设置配置项
-      var sceneId = this.container.get(TYPES.SceneID); // 初始化图层配置项
-      // const { enableMultiPassRenderer = false } = this.rawConfig;
-      // this.configService.setLayerConfig(sceneId, this.id, {
-      //   enableMultiPassRenderer,
-      // });
-
-      this.configService.setLayerConfig(sceneId, this.id, this.rawConfig);
-      this.layerType = this.rawConfig.layerType; // 全局容器服务
-      // 场景容器服务
-
-      this.iconService = this.container.get(TYPES.IIconService);
-      this.fontService = this.container.get(TYPES.IFontService);
-      this.rendererService = this.container.get(TYPES.IRendererService);
-      this.layerService = this.container.get(TYPES.ILayerService);
-      this.interactionService = this.container.get(TYPES.IInteractionService);
-      this.pickingService = this.container.get(TYPES.IPickingService);
-      this.mapService = this.container.get(TYPES.IMapService);
-
-      var _this$getLayerConfig = this.getLayerConfig(),
-          enableMultiPassRenderer = _this$getLayerConfig.enableMultiPassRenderer,
-          passes = _this$getLayerConfig.passes;
-
-      if (enableMultiPassRenderer && passes !== null && passes !== void 0 && passes.length && passes.length > 0) {
-        // Tip: 兼容 multiPassRender 在 amap1 时存在的图层不同步问题 zoom
-        this.mapService.on('mapAfterFrameChange', function () {
-          _this3.renderLayers();
-        });
-      }
+    value: function () {
+      var _init = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+        var _this3 = this;
+
+        var sceneId, _this$getLayerConfig, enableMultiPassRenderer, passes, _iterator, _step, plugin;
+
+        return _regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                // 设置配置项
+                sceneId = this.container.get(TYPES.SceneID);
+                this.startInit = true; // 初始化图层配置项
+                // const { enableMultiPassRenderer = false } = this.rawConfig;
+                // this.configService.setLayerConfig(sceneId, this.id, {
+                //   enableMultiPassRenderer,
+                // });
+
+                this.configService.setLayerConfig(sceneId, this.id, this.rawConfig);
+                this.layerType = this.rawConfig.layerType; // 全局容器服务
+                // 场景容器服务
+
+                this.iconService = this.container.get(TYPES.IIconService);
+                this.fontService = this.container.get(TYPES.IFontService);
+                this.rendererService = this.container.get(TYPES.IRendererService);
+                this.layerService = this.container.get(TYPES.ILayerService);
+                this.interactionService = this.container.get(TYPES.IInteractionService);
+                this.pickingService = this.container.get(TYPES.IPickingService);
+                this.mapService = this.container.get(TYPES.IMapService);
+                _this$getLayerConfig = this.getLayerConfig(), enableMultiPassRenderer = _this$getLayerConfig.enableMultiPassRenderer, passes = _this$getLayerConfig.passes;
+
+                if (enableMultiPassRenderer && passes !== null && passes !== void 0 && passes.length && passes.length > 0) {
+                  // Tip: 兼容 multiPassRender 在 amap1 时存在的图层不同步问题 zoom
+                  this.mapService.on('mapAfterFrameChange', function () {
+                    _this3.renderLayers();
+                  });
+                }
 
-      this.cameraService = this.container.get(TYPES.ICameraService);
-      this.coordinateService = this.container.get(TYPES.ICoordinateSystemService);
-      this.shaderModuleService = this.container.get(TYPES.IShaderModuleService);
-      this.postProcessingPassFactory = this.container.get(TYPES.IFactoryPostProcessingPass);
-      this.normalPassFactory = this.container.get(TYPES.IFactoryNormalPass); // 图层容器服务
+                this.cameraService = this.container.get(TYPES.ICameraService);
+                this.coordinateService = this.container.get(TYPES.ICoordinateSystemService);
+                this.shaderModuleService = this.container.get(TYPES.IShaderModuleService);
+                this.postProcessingPassFactory = this.container.get(TYPES.IFactoryPostProcessingPass);
+                this.normalPassFactory = this.container.get(TYPES.IFactoryNormalPass); // 图层容器服务
+
+                this.styleAttributeService = this.container.get(TYPES.IStyleAttributeService);
+
+                if (enableMultiPassRenderer) {
+                  // 按需初始化 瓦片频繁报错
+                  this.multiPassRenderer = this.container.get(TYPES.IMultiPassRenderer);
+                  this.multiPassRenderer.setLayer(this);
+                } // 完成样式服务注册完成前添加的属性
+
+
+                this.pendingStyleAttributes.forEach(function (_ref2) {
+                  var attributeName = _ref2.attributeName,
+                      attributeField = _ref2.attributeField,
+                      attributeValues = _ref2.attributeValues,
+                      updateOptions = _ref2.updateOptions;
+
+                  _this3.styleAttributeService.updateStyleAttribute(attributeName, {
+                    // @ts-ignore
+                    scale: _objectSpread({
+                      field: attributeField
+                    }, _this3.splitValuesAndCallbackInAttribute( // @ts-ignore
+                    attributeValues, // @ts-ignore
+                    _this3.getLayerConfig()[attributeName]))
+                  }, // @ts-ignore
+                  updateOptions);
+                });
+                this.pendingStyleAttributes = []; // 获取插件集
+
+                this.plugins = this.container.getAll(TYPES.ILayerPlugin); // 完成插件注册，传入场景和图层容器内的服务
+
+                _iterator = _createForOfIteratorHelper(this.plugins);
+
+                try {
+                  for (_iterator.s(); !(_step = _iterator.n()).done;) {
+                    plugin = _step.value;
+                    plugin.apply(this, {
+                      rendererService: this.rendererService,
+                      mapService: this.mapService,
+                      styleAttributeService: this.styleAttributeService,
+                      normalPassFactory: this.normalPassFactory,
+                      postProcessingPassFactory: this.postProcessingPassFactory
+                    });
+                  } // 初始化其他服务
+
+                } catch (err) {
+                  _iterator.e(err);
+                } finally {
+                  _iterator.f();
+                }
 
-      this.styleAttributeService = this.container.get(TYPES.IStyleAttributeService);
-      this.multiPassRenderer = this.container.get(TYPES.IMultiPassRenderer);
-      this.multiPassRenderer.setLayer(this); // 完成样式服务注册完成前添加的属性
+                this.layerPickService = new LayerPickService(this); // 颜色纹理服务
 
-      this.pendingStyleAttributes.forEach(function (_ref2) {
-        var attributeName = _ref2.attributeName,
-            attributeField = _ref2.attributeField,
-            attributeValues = _ref2.attributeValues,
-            updateOptions = _ref2.updateOptions;
+                this.textureService = new TextureService(this); // 触发 init 生命周期插件
 
-        _this3.styleAttributeService.updateStyleAttribute(attributeName, {
-          // @ts-ignore
-          scale: _objectSpread({
-            field: attributeField
-          }, _this3.splitValuesAndCallbackInAttribute( // @ts-ignore
-          attributeValues, // @ts-ignore
-          _this3.getLayerConfig()[attributeName]))
-        }, // @ts-ignore
-        updateOptions);
-      });
-      this.pendingStyleAttributes = []; // 获取插件集
-
-      this.plugins = this.container.getAll(TYPES.ILayerPlugin); // 完成插件注册，传入场景和图层容器内的服务
-
-      var _iterator = _createForOfIteratorHelper(this.plugins),
-          _step;
-
-      try {
-        for (_iterator.s(); !(_step = _iterator.n()).done;) {
-          var plugin = _step.value;
-          plugin.apply(this, {
-            rendererService: this.rendererService,
-            mapService: this.mapService,
-            styleAttributeService: this.styleAttributeService,
-            normalPassFactory: this.normalPassFactory,
-            postProcessingPassFactory: this.postProcessingPassFactory
-          });
-        } // 触发 init 生命周期插件
-
-      } catch (err) {
-        _iterator.e(err);
-      } finally {
-        _iterator.f();
-      }
+                _context.next = 29;
+                return this.hooks.init.promise();
 
-      this.hooks.init.call(); // this.pickingPassRender = this.normalPassFactory('pixelPicking');
-      // this.pickingPassRender.init(this);
+              case 29:
+                this.inited = true; // 触发初始化完成事件;
 
-      this.hooks.afterInit.call(); // 触发初始化完成事件;
+                this.emit('inited', {
+                  target: this,
+                  type: 'inited'
+                });
+                this.emit('add', {
+                  target: this,
+                  type: 'add'
+                });
+                this.hooks.afterInit.call();
 
-      this.emit('inited', {
-        target: this,
-        type: 'inited'
-      });
-      this.emit('add', {
-        target: this,
-        type: 'add'
-      });
-      return this;
-    }
+              case 33:
+              case "end":
+                return _context.stop();
+            }
+          }
+        }, _callee, this);
+      }));
+
+      function init() {
+        return _init.apply(this, arguments);
+      }
+
+      return init;
+    }()
   }, {
     key: "updateModelData",
     value: function updateModelData(data) {
@@ -390,6 +409,11 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
         };
       }
     }
+  }, {
+    key: "setLayerPickService",
+    value: function setLayerPickService(layerPickService) {
+      this.layerPickService = layerPickService;
+    }
   }, {
     key: "calculateEncodeData",
     value: function calculateEncodeData(data, option) {
@@ -407,8 +431,7 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
   }, {
     key: "prepareBuildModel",
     value: function prepareBuildModel() {
-      this.inited = true;
-      this.updateLayerConfig(_objectSpread(_objectSpread({}, this.getDefaultConfig()), this.rawConfig)); // 启动动画
+      this.updateLayerConfig(_objectSpread(_objectSpread(_objectSpread({}, this.getDefaultConfig()), this.rawConfig), this.needUpdateConfig)); // 启动动画
 
       var _this$getLayerConfig2 = this.getLayerConfig(),
           animateOption = _this$getLayerConfig2.animateOption;
@@ -504,7 +527,8 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
         // 判断是否为source
         this.setSource(data);
         return this;
-      }
+      } // 设置source 配置
+
 
       this.sourceOption = {
         data: data,
@@ -527,8 +551,6 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
           if (!currentSource) {
             // 执行 setData 的时候 source 还不存在（还未执行 addLayer）
             _this4.source(new Source(data, options));
-
-            _this4.sourceEvent();
           } else {
             _this4.layerSource.setData(data, options);
           } // this.layerSource.setData(data, options);
@@ -543,8 +565,6 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
     value: function style(options) {
       var _this5 = this;
 
-      var lastConfig = this.getLayerConfig();
-
       var passes = options.passes,
           rest = _objectWithoutProperties(options, _excluded); // passes 特殊处理
 
@@ -564,16 +584,16 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
       if (this.container) {
         this.updateLayerConfig(this.rawConfig);
         this.styleNeedUpdate = true;
-      } // @ts-ignore
+      } // TODO style model 更新
+      // @ts-ignore
+      // if (lastConfig && lastConfig.mask === true && options.mask === false) {
+      //   this.clearModels();
+      //   this.layerModel.buildModels((models) => {
+      //     this.models = models;
+      //   });
+      // }
 
 
-      if (lastConfig && lastConfig.mask === true && options.mask === false) {
-        this.clearModels();
-        this.layerModel.buildModels(function (models) {
-          _this5.models = models;
-        });
-      }
-
       return this;
     }
   }, {
@@ -607,6 +627,8 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
         return this;
       }
 
+      this.layerService.beforeRenderData(this);
+
       if (this.encodeDataLength <= 0 && !this.forceRender) {
         return this;
       } // Tip: this.getEncodedData().length !== 0 这个判断是为了解决在 2.5.x 引入数据纹理后产生的 空数据渲染导致 texture 超出上限问题
@@ -622,29 +644,29 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
   }, {
     key: "renderMultiPass",
     value: function () {
-      var _renderMultiPass = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-        return _regeneratorRuntime.wrap(function _callee$(_context) {
+      var _renderMultiPass = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
           while (1) {
-            switch (_context.prev = _context.next) {
+            switch (_context2.prev = _context2.next) {
               case 0:
                 if (!(this.encodeDataLength <= 0 && !this.forceRender)) {
-                  _context.next = 2;
+                  _context2.next = 2;
                   break;
                 }
 
-                return _context.abrupt("return");
+                return _context2.abrupt("return");
 
               case 2:
                 if (!(this.multiPassRenderer && this.multiPassRenderer.getRenderFlag())) {
-                  _context.next = 7;
+                  _context2.next = 7;
                   break;
                 }
 
-                _context.next = 5;
+                _context2.next = 5;
                 return this.multiPassRenderer.render();
 
               case 5:
-                _context.next = 8;
+                _context2.next = 8;
                 break;
 
               case 7:
@@ -657,10 +679,10 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
 
               case 8:
               case "end":
-                return _context.stop();
+                return _context2.stop();
             }
           }
-        }, _callee, this);
+        }, _callee2, this);
       }));
 
       function renderMultiPass() {
@@ -849,7 +871,7 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
           _this$getLayerConfig5 = _this$getLayerConfig3.maxZoom,
           maxZoom = _this$getLayerConfig5 === void 0 ? Infinity : _this$getLayerConfig5;
 
-      return !!visible && zoom >= minZoom && zoom <= maxZoom;
+      return !!visible && zoom >= minZoom && zoom < maxZoom;
     }
   }, {
     key: "setMultiPass",
@@ -979,7 +1001,8 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
       this.hooks.beforeDestroy.call(); // 清除sources事件
 
       this.layerSource.off('update', this.sourceEvent);
-      (_this$multiPassRender = this.multiPassRenderer) === null || _this$multiPassRender === void 0 ? void 0 : _this$multiPassRender.destroy(); // 清除所有属性以及关联的 vao == 销毁所有 => model this.models.forEach((model) => model.destroy());
+      (_this$multiPassRender = this.multiPassRenderer) === null || _this$multiPassRender === void 0 ? void 0 : _this$multiPassRender.destroy();
+      this.textureService.destroy(); // 清除所有属性以及关联的 vao == 销毁所有 => model this.models.forEach((model) => model.destroy());
 
       this.styleAttributeService.clearAllAttributes(); // 执行每个图层单独的 clearModels 方法 （清除一些额外的 texture、program、buffer 等）
 
@@ -1024,13 +1047,14 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
       return !!(this.styleAttributeService.getLayerStyleAttributes() || []).filter(function (attribute) {
         return attribute.needRescale || attribute.needRemapping || attribute.needRegenerateVertices;
       }).length;
-    }
+    } // 外部初始化Source
+
   }, {
     key: "setSource",
     value: function setSource(source) {
       var _this8 = this;
 
-      // 清除旧 sources 事件
+      // 解除原 sources 事件
       if (this.layerSource) {
         this.layerSource.off('update', this.sourceEvent);
       }
@@ -1041,15 +1065,16 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
       if (this.inited && this.layerSource.cluster) {
         var zoom = this.mapService.getZoom();
         this.layerSource.updateClusterData(zoom);
-      } // source 可能会复用，会在其它layer被修改
-
+      }
 
       if (this.layerSource.inited) {
         this.sourceEvent();
       } // this.layerSource.inited 为 true update 事件不会再触发
 
 
-      this.layerSource.on('update', function () {
+      this.layerSource.on('update', function (_ref3) {
+        var type = _ref3.type;
+
         if (_this8.coordCenter === undefined) {
           var _this8$mapService;
 
@@ -1061,13 +1086,45 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
           }
         }
 
-        _this8.sourceEvent();
+        if (type === 'update') {
+          // source 初始化不需要处理
+          _this8.sourceEvent();
+        }
       });
+    } // layer 初始化source
+
+  }, {
+    key: "initSource",
+    value: function initSource(source) {
+      this.layerSource = source;
+      this.clusterZoom = 0;
+      this.addSourceEvent();
     }
   }, {
     key: "getSource",
     value: function getSource() {
       return this.layerSource;
+    } // 注册source 更新事件
+
+  }, {
+    key: "addSourceEvent",
+    value: function addSourceEvent() {
+      var _this9 = this;
+
+      this.layerSource.on('update', function () {
+        if (_this9.coordCenter === undefined) {
+          var _this9$mapService;
+
+          var layerCenter = _this9.layerSource.center;
+          _this9.coordCenter = layerCenter;
+
+          if ((_this9$mapService = _this9.mapService) !== null && _this9$mapService !== void 0 && _this9$mapService.setCoordCenter) {
+            _this9.mapService.setCoordCenter(layerCenter);
+          }
+        }
+
+        _this9.sourceEvent();
+      });
     }
   }, {
     key: "getScaleOptions",
@@ -1146,9 +1203,9 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
     }
   }, {
     key: "pick",
-    value: function pick(_ref6) {
-      var x = _ref6.x,
-          y = _ref6.y;
+    value: function pick(_ref7) {
+      var x = _ref7.x,
+          y = _ref7.y;
       this.interactionService.triggerHover({
         x: x,
         y: y
@@ -1161,76 +1218,79 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
     }
   }, {
     key: "buildLayerModel",
-    value: function buildLayerModel(options) {
-      var _this9 = this;
+    value: function () {
+      var _buildLayerModel = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(options) {
+        var _this10 = this;
 
-      var moduleName = options.moduleName,
-          vertexShader = options.vertexShader,
-          fragmentShader = options.fragmentShader,
-          triangulation = options.triangulation,
-          segmentNumber = options.segmentNumber,
-          _options$workerEnable = options.workerEnabled,
-          workerEnabled = _options$workerEnable === void 0 ? false : _options$workerEnable,
-          workerOptions = options.workerOptions,
-          rest = _objectWithoutProperties(options, _excluded2);
-
-      this.shaderModuleService.registerModule(moduleName, {
-        vs: vertexShader,
-        fs: fragmentShader
-      });
+        var moduleName, vertexShader, fragmentShader, triangulation, segmentNumber, _options$workerEnable, workerEnabled, workerOptions, rest, _this$shaderModuleSer, vs, fs, uniforms, createModel;
 
-      var _this$shaderModuleSer = this.shaderModuleService.getModule(moduleName),
-          vs = _this$shaderModuleSer.vs,
-          fs = _this$shaderModuleSer.fs,
-          uniforms = _this$shaderModuleSer.uniforms;
-
-      var createModel = this.rendererService.createModel;
-      return new Promise(function (resolve, reject) {
-        setTimeout(function () {
-          // filter supported worker & worker enabled layer
-          if (workerOptions && workerOptions.modelType in WorkerSourceMap && workerEnabled) {
-            _this9.styleAttributeService.createAttributesAndIndicesAscy(_this9.encodedData, segmentNumber, workerOptions).then(function (_ref7) {
-              var attributes = _ref7.attributes,
-                  elements = _ref7.elements;
-              var m = createModel(_objectSpread({
-                attributes: attributes,
-                uniforms: uniforms,
-                fs: fs,
-                vs: vs,
-                elements: elements,
-                blend: BlendTypes[BlendType.normal]
-              }, rest));
-              resolve(m);
-            }).catch(function (err) {
-              return reject(err);
-            });
-          } else {
-            // console.log(this.encodedData[1].originCoordinates[0])
-            // console.log(this.encodedData[1].coordinates[0])
-            var _this9$styleAttribute = _this9.styleAttributeService.createAttributesAndIndices(_this9.encodedData, triangulation, segmentNumber),
-                attributes = _this9$styleAttribute.attributes,
-                elements = _this9$styleAttribute.elements,
-                count = _this9$styleAttribute.count;
-
-            var modelOptions = _objectSpread({
-              attributes: attributes,
-              uniforms: uniforms,
-              fs: fs,
-              vs: vs,
-              elements: elements,
-              blend: BlendTypes[BlendType.normal]
-            }, rest);
-
-            if (count) {
-              modelOptions.count = count;
-            }
+        return _regeneratorRuntime.wrap(function _callee3$(_context3) {
+          while (1) {
+            switch (_context3.prev = _context3.next) {
+              case 0:
+                moduleName = options.moduleName, vertexShader = options.vertexShader, fragmentShader = options.fragmentShader, triangulation = options.triangulation, segmentNumber = options.segmentNumber, _options$workerEnable = options.workerEnabled, workerEnabled = _options$workerEnable === void 0 ? false : _options$workerEnable, workerOptions = options.workerOptions, rest = _objectWithoutProperties(options, _excluded2);
+                this.shaderModuleService.registerModule(moduleName, {
+                  vs: vertexShader,
+                  fs: fragmentShader
+                });
+                _this$shaderModuleSer = this.shaderModuleService.getModule(moduleName), vs = _this$shaderModuleSer.vs, fs = _this$shaderModuleSer.fs, uniforms = _this$shaderModuleSer.uniforms;
+                createModel = this.rendererService.createModel;
+                return _context3.abrupt("return", new Promise(function (resolve, reject) {
+                  // filter supported worker & worker enabled layer
+                  if (workerOptions && workerOptions.modelType in WorkerSourceMap && workerEnabled) {
+                    _this10.styleAttributeService.createAttributesAndIndicesAscy(_this10.encodedData, segmentNumber, workerOptions).then(function (_ref8) {
+                      var attributes = _ref8.attributes,
+                          elements = _ref8.elements;
+                      var m = createModel(_objectSpread({
+                        attributes: attributes,
+                        uniforms: uniforms,
+                        fs: fs,
+                        vs: vs,
+                        elements: elements,
+                        blend: BlendTypes[BlendType.normal]
+                      }, rest));
+                      resolve(m);
+                    }).catch(function (err) {
+                      return reject(err);
+                    });
+                  } else {
+                    var _this10$styleAttribut = _this10.styleAttributeService.createAttributesAndIndices(_this10.encodedData, triangulation, segmentNumber),
+                        attributes = _this10$styleAttribut.attributes,
+                        elements = _this10$styleAttribut.elements,
+                        count = _this10$styleAttribut.count;
+
+                    var modelOptions = _objectSpread({
+                      attributes: attributes,
+                      uniforms: uniforms,
+                      fs: fs,
+                      vs: vs,
+                      elements: elements,
+                      blend: BlendTypes[BlendType.normal]
+                    }, rest);
+
+                    if (count) {
+                      modelOptions.count = count;
+                    }
+
+                    var m = createModel(modelOptions);
+                    resolve(m);
+                  }
+                }));
 
-            var m = createModel(modelOptions);
-            resolve(m);
+              case 5:
+              case "end":
+                return _context3.stop();
+            }
           }
-        });
-      });
-    }
+        }, _callee3, this);
+      }));
+
+      function buildLayerModel(_x) {
+        return _buildLayerModel.apply(this, arguments);
+      }
+
+      return buildLayerModel;
+    }()
   }, {
     key: "createAttributes",
     value: function createAttributes(options) {
@@ -1272,11 +1332,6 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
   }, {
     key: "needPick",
     value: function needPick(type) {
-      // 地图图层的判断
-      if (this.rawConfig.usage === 'basemap') {
-        return false;
-      }
-
       var _this$getLayerConfig10 = this.getLayerConfig(),
           _this$getLayerConfig11 = _this$getLayerConfig10.enableHighlight,
           enableHighlight = _this$getLayerConfig11 === void 0 ? true : _this$getLayerConfig11,
@@ -1298,34 +1353,73 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
     }
   }, {
     key: "buildModels",
-    value: function buildModels() {
-      throw new Error('Method not implemented.');
-    }
+    value: function () {
+      var _buildModels = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
+        return _regeneratorRuntime.wrap(function _callee4$(_context4) {
+          while (1) {
+            switch (_context4.prev = _context4.next) {
+              case 0:
+                throw new Error('Method not implemented.');
+
+              case 1:
+              case "end":
+                return _context4.stop();
+            }
+          }
+        }, _callee4);
+      }));
+
+      function buildModels() {
+        return _buildModels.apply(this, arguments);
+      }
+
+      return buildModels;
+    }()
   }, {
     key: "rebuildModels",
-    value: function rebuildModels() {
-      throw new Error('Method not implemented.');
-    }
+    value: function () {
+      var _rebuildModels = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
+        return _regeneratorRuntime.wrap(function _callee5$(_context5) {
+          while (1) {
+            switch (_context5.prev = _context5.next) {
+              case 0:
+                _context5.next = 2;
+                return this.buildModels();
+
+              case 2:
+              case "end":
+                return _context5.stop();
+            }
+          }
+        }, _callee5, this);
+      }));
+
+      function rebuildModels() {
+        return _rebuildModels.apply(this, arguments);
+      }
+
+      return rebuildModels;
+    }()
   }, {
     key: "renderMulPass",
     value: function () {
-      var _renderMulPass = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(multiPassRenderer) {
-        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+      var _renderMulPass = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6(multiPassRenderer) {
+        return _regeneratorRuntime.wrap(function _callee6$(_context6) {
           while (1) {
-            switch (_context2.prev = _context2.next) {
+            switch (_context6.prev = _context6.next) {
               case 0:
-                _context2.next = 2;
+                _context6.next = 2;
                 return multiPassRenderer.render();
 
               case 2:
               case "end":
-                return _context2.stop();
+                return _context6.stop();
             }
           }
-        }, _callee2);
+        }, _callee6);
       }));
 
-      function renderMulPass(_x) {
+      function renderMulPass(_x2) {
         return _renderMulPass.apply(this, arguments);
       }
 
@@ -1334,34 +1428,35 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
   }, {
     key: "renderModels",
     value: function renderModels(isPicking) {
-      var _this10 = this;
+      var _this11 = this;
 
       // TODO: this.getEncodedData().length > 0 这个判断是为了解决在 2.5.x 引入数据纹理后产生的 空数据渲染导致 texture 超出上限问题
       if (this.encodeDataLength <= 0 && !this.forceRender) {
         return this;
       }
 
-      if (this.layerModelNeedUpdate && this.layerModel) {
-        this.layerModel.buildModels(function (models) {
-          _this10.models = models;
-
-          _this10.hooks.beforeRender.call();
-
-          _this10.layerModelNeedUpdate = false;
-        });
-      }
-
+      this.hooks.beforeRender.call();
       this.models.forEach(function (model) {
         model.draw({
-          uniforms: _this10.layerModel.getUninforms()
+          uniforms: _this11.layerModel.getUninforms()
         }, isPicking);
       });
+      this.hooks.afterRender.call();
       return this;
     }
   }, {
     key: "updateStyleAttribute",
     value: function updateStyleAttribute(type, field, values, updateOptions) {
-      if (!this.inited) {
+      // 存储 Attribute
+      if (['color', 'size', 'texture', 'rotate', 'filter', 'label', 'shape'].indexOf(type) !== -1) {
+        this.configService.setAttributeConfig(this.id, _defineProperty({}, type, {
+          field: field,
+          values: values
+        }));
+      }
+
+      if (!this.startInit) {
+        // 开始初始化执行
         this.pendingStyleAttributes.push({
           attributeName: type,
           attributeField: field,
@@ -1380,6 +1475,11 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
         updateOptions);
       }
     }
+  }, {
+    key: "getLayerAttributeConfig",
+    value: function getLayerAttributeConfig() {
+      return this.configService.getAttributeConfig(this.id);
+    }
   }, {
     key: "getShaderPickStat",
     value: function getShaderPickStat() {
@@ -1395,6 +1495,13 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
     key: "setEarthTime",
     value: function setEarthTime(time) {
       console.warn('empty fn');
+    } // 数据处理 在数据进行 mapping 生成 encodeData 之前对数据进行处理
+    // 在各个 layer 中继承
+
+  }, {
+    key: "processData",
+    value: function processData(filterData) {
+      return filterData;
     }
   }, {
     key: "getModelType",
@@ -1407,23 +1514,37 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__P
       return {};
     }
   }, {
-    key: "dispatchModelLoad",
-    value: function dispatchModelLoad(models) {
-      var _this11 = this;
+    key: "initLayerModels",
+    value: function () {
+      var _initLayerModels = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee7() {
+        return _regeneratorRuntime.wrap(function _callee7$(_context7) {
+          while (1) {
+            switch (_context7.prev = _context7.next) {
+              case 0:
+                this.models.forEach(function (model) {
+                  return model.destroy();
+                });
+                this.models = [];
+                _context7.next = 4;
+                return this.layerModel.initModels();
 
-      this.models.forEach(function (model) {
-        return model.destroy();
-      });
-      this.models = [];
-      this.models = models;
-      this.emit('modelLoaded', null);
-      this.modelLoaded = true; // Tip: setTimeout 用于延迟绘制，可以让拖动图层时连续的 setData 更加平滑 - L7Draw
+              case 4:
+                this.models = _context7.sent;
 
-      setTimeout(function () {
-        // Tip: 使用 renderLayers 而不是 throttleRenderLayers，让图层之间的 setData 更新绘制不存在延迟
-        _this11.layerService.renderLayers();
-      }, 32);
-    }
+              case 5:
+              case "end":
+                return _context7.stop();
+            }
+          }
+        }, _callee7, this);
+      }));
+
+      function initLayerModels() {
+        return _initLayerModels.apply(this, arguments);
+      }
+
+      return initLayerModels;
+    }()
   }, {
     key: "reRender",
     value: function reRender() {