@antv/l7-layers 2.9.19 → 2.9.22-alpha.0

package/es/core/BaseLayer.js

@@ -1,5 +1,6 @@
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import _initializerDefineProperty from "@babel/runtime/helpers/initializerDefineProperty";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
@@ -10,9 +11,6 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _applyDecoratedDescriptor from "@babel/runtime/helpers/applyDecoratedDescriptor";
 import _initializerWarningHelper from "@babel/runtime/helpers/initializerWarningHelper";
-import _isUndefined from "lodash/isUndefined";
-import _isObject from "lodash/isObject";
-import _isFunction from "lodash/isFunction";
 var _excluded = ["passes"],
     _excluded2 = ["moduleName", "vertexShader", "fragmentShader", "triangulation", "segmentNumber", "workerEnabled", "workerOptions"];
 
@@ -26,30 +24,42 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
+// @ts-ignore
 import { SyncBailHook, SyncHook, SyncWaterfallHook } 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 { BlendTypes } from '../utils/blend';
-import { handleStyleDataMapping } from '../utils/dataMappingStyle';
-import { calculateData } from '../utils/layerData';
-import { createMultiPassRenderer, normalizePasses } from '../utils/multiPassRender';
-import { updateShape } from '../utils/updateShape';
+import { isFunction, isObject, isUndefined } from 'lodash';
+import { BlendTypes } from "../utils/blend";
+import { handleStyleDataMapping } from "../utils/dataMappingStyle";
+import { calculateData } from "../utils/layerData";
+import { createMultiPassRenderer, normalizePasses } from "../utils/multiPassRender";
+import { updateShape } from "../utils/updateShape";
+/**
+ * 分配 layer id
+ */
+
 var layerIdCounter = 0;
-var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = function (_EventEmitter) {
-  _inherits(BaseLayer, _EventEmitter);
+var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = /*#__PURE__*/function (_ref) {
+  _inherits(BaseLayer, _ref);
 
   var _super = _createSuper(BaseLayer);
 
+  // 生命周期钩子
+  // 待渲染 model 列表
+  // TODO: 用于保存子图层对象
+  // Tip: 用于标识矢量图层
+
+  /**
+   * 待更新样式属性，在初始化阶段完成注册
+   */
+  // TODO: layer 保底颜色
+  // private pickingPassRender: IPass<'pixelPicking'>;
   function BaseLayer() {
     var _this;
 
@@ -63,16 +73,10 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
 
     _defineProperty(_assertThisInitialized(_this), "name", "".concat(layerIdCounter));
 
-    _defineProperty(_assertThisInitialized(_this), "type", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "visible", true);
 
     _defineProperty(_assertThisInitialized(_this), "zIndex", 0);
 
-    _defineProperty(_assertThisInitialized(_this), "minZoom", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "maxZoom", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "inited", false);
 
     _defineProperty(_assertThisInitialized(_this), "layerModelNeedUpdate", false);
@@ -83,14 +87,8 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
 
     _defineProperty(_assertThisInitialized(_this), "styleNeedUpdate", false);
 
-    _defineProperty(_assertThisInitialized(_this), "rendering", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "clusterZoom", 0);
 
-    _defineProperty(_assertThisInitialized(_this), "layerType", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "triangulation", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "dataState", {
       dataSourceNeedUpdate: false,
       dataMappingNeedUpdate: false,
@@ -117,20 +115,6 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
 
     _defineProperty(_assertThisInitialized(_this), "models", []);
 
-    _defineProperty(_assertThisInitialized(_this), "multiPassRenderer", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "plugins", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "sourceOption", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "layerModel", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "shapeOption", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "sceneContainer", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "tileLayer", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "layerChildren", []);
 
     _defineProperty(_assertThisInitialized(_this), "masks", []);
@@ -139,56 +123,16 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
 
     _initializerDefineProperty(_assertThisInitialized(_this), "configService", _descriptor, _assertThisInitialized(_this));
 
-    _defineProperty(_assertThisInitialized(_this), "shaderModuleService", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "cameraService", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "coordinateService", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "iconService", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "fontService", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "pickingService", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "rendererService", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "layerService", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "interactionService", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "mapService", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "styleAttributeService", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "layerSource", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "postProcessingPassFactory", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "normalPassFactory", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "animateOptions", {
       enable: false
     });
 
-    _defineProperty(_assertThisInitialized(_this), "container", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "encodedData", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "configSchema", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "currentPickId", null);
 
-    _defineProperty(_assertThisInitialized(_this), "rawConfig", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "needUpdateConfig", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "pendingStyleAttributes", []);
 
     _defineProperty(_assertThisInitialized(_this), "scaleOptions", {});
 
-    _defineProperty(_assertThisInitialized(_this), "animateStartTime", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "aniamateStatus", false);
 
     _defineProperty(_assertThisInitialized(_this), "bottomColor", 'rgba(0, 0, 0, 0)');
@@ -202,7 +146,9 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
 
       if (layerConfig && layerConfig.autoFit) {
         _this.fitBounds(layerConfig.fitBoundsOptions);
-      }
+      } // 对外暴露事件 迁移到 DataMappingPlugin generateMapping，保证在重新重新映射后触发
+      // this.emit('dataUpdate');
+
 
       _this.reRender();
     });
@@ -244,8 +190,10 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     value: function updateLayerConfig(configToUpdate) {
       var _this2 = this;
 
+      // 同步 rawConfig
       Object.keys(configToUpdate).map(function (key) {
         if (key in _this2.rawConfig) {
+          // @ts-ignore
           _this2.rawConfig[key] = configToUpdate[key];
         }
       });
@@ -253,12 +201,21 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
       if (!this.inited) {
         this.needUpdateConfig = _objectSpread(_objectSpread({}, this.needUpdateConfig), configToUpdate);
       } else {
-        var sceneId = this.container.get(TYPES.SceneID);
-        handleStyleDataMapping(configToUpdate, this);
+        var sceneId = this.container.get(TYPES.SceneID); // @ts-ignore
+
+        handleStyleDataMapping(configToUpdate, this); // 处理 style 中进行数据映射的属性字段
+
         this.configService.setLayerConfig(sceneId, this.id, _objectSpread(_objectSpread(_objectSpread({}, this.configService.getLayerConfig(this.id)), this.needUpdateConfig), configToUpdate));
         this.needUpdateConfig = {};
       }
     }
+    /**
+     * 注入图层容器，父容器为场景容器
+     * RootContainer 1
+     *  -> SceneContainer 1.*
+     *   -> LayerContainer 1.*
+     */
+
   }, {
     key: "setContainer",
     value: function setContainer(container, sceneContainer) {
@@ -283,6 +240,11 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
   }, {
     key: "addPlugin",
     value: function addPlugin(plugin) {
+      // TODO: 控制插件注册顺序
+      // @example:
+      // pointLayer.addPlugin(new MyCustomPlugin(), {
+      //   before: 'L7BuiltinPlugin'
+      // });
       this.plugins.push(plugin);
       return this;
     }
@@ -291,9 +253,17 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     value: function init() {
       var _this3 = this;
 
-      var sceneId = this.container.get(TYPES.SceneID);
+      // 设置配置项
+      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.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);
@@ -307,6 +277,7 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
           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();
         });
@@ -316,24 +287,31 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
       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.normalPassFactory = this.container.get(TYPES.IFactoryNormalPass); // 图层容器服务
+
       this.styleAttributeService = this.container.get(TYPES.IStyleAttributeService);
       this.multiPassRenderer = this.container.get(TYPES.IMultiPassRenderer);
-      this.multiPassRenderer.setLayer(this);
-      this.pendingStyleAttributes.forEach(function (_ref) {
-        var attributeName = _ref.attributeName,
-            attributeField = _ref.attributeField,
-            attributeValues = _ref.attributeValues,
-            updateOptions = _ref.updateOptions;
+      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(attributeValues, _this3.getLayerConfig()[attributeName]))
-        }, updateOptions);
+          }, _this3.splitValuesAndCallbackInAttribute( // @ts-ignore
+          attributeValues, // @ts-ignore
+          _this3.getLayerConfig()[attributeName]))
+        }, // @ts-ignore
+        updateOptions);
       });
-      this.pendingStyleAttributes = [];
-      this.plugins = this.container.getAll(TYPES.ILayerPlugin);
+      this.pendingStyleAttributes = []; // 获取插件集
+
+      this.plugins = this.container.getAll(TYPES.ILayerPlugin); // 完成插件注册，传入场景和图层容器内的服务
 
       var _iterator = _createForOfIteratorHelper(this.plugins),
           _step;
@@ -348,15 +326,19 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
             normalPassFactory: this.normalPassFactory,
             postProcessingPassFactory: this.postProcessingPassFactory
           });
-        }
+        } // 触发 init 生命周期插件
+
       } catch (err) {
         _iterator.e(err);
       } finally {
         _iterator.f();
       }
 
-      this.hooks.init.call();
-      this.hooks.afterInit.call();
+      this.hooks.init.call(); // this.pickingPassRender = this.normalPassFactory('pixelPicking');
+      // this.pickingPassRender.init(this);
+
+      this.hooks.afterInit.call(); // 触发初始化完成事件;
+
       this.emit('inited', {
         target: this,
         type: 'inited'
@@ -384,6 +366,7 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
       var _this$layerModel;
 
       if ((_this$layerModel = this.layerModel) !== null && _this$layerModel !== void 0 && _this$layerModel.createModelData) {
+        // 在某些特殊图层中单独构建 attribute & elements
         return this.layerModel.createModelData(option);
       }
 
@@ -409,11 +392,15 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
         return null;
       }
     }
+    /**
+     * Model初始化前需要更新Model样式
+     */
+
   }, {
     key: "prepareBuildModel",
     value: function prepareBuildModel() {
       this.inited = true;
-      this.updateLayerConfig(_objectSpread(_objectSpread({}, this.getDefaultConfig()), this.rawConfig));
+      this.updateLayerConfig(_objectSpread(_objectSpread({}, this.getDefaultConfig()), this.rawConfig)); // 启动动画
 
       var _this$getLayerConfig2 = this.getLayerConfig(),
           animateOption = _this$getLayerConfig2.animateOption;
@@ -426,9 +413,18 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
   }, {
     key: "color",
     value: function color(field, values, updateOptions) {
-      this.updateStyleAttribute('color', field, values, updateOptions);
+      // 设置 color、size、shape、style 时由于场景服务尚未完成（并没有调用 scene.addLayer），因此暂时加入待更新属性列表
+      this.updateStyleAttribute('color', field, values, updateOptions); // this.pendingStyleAttributes.push({
+      //   attributeName: 'color',
+      //   attributeField: field,
+      //   attributeValues: values,
+      //   defaultName: 'colors',
+      //   updateOptions,
+      // });
+
       return this;
-    }
+    } // 为对应的图层传入纹理的编号名称（point/image 在 shape 方法中传入纹理名称的方法并不通用）
+
   }, {
     key: "texture",
     value: function texture(field, values, updateOptions) {
@@ -446,7 +442,8 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     value: function size(field, values, updateOptions) {
       this.updateStyleAttribute('size', field, values, updateOptions);
       return this;
-    }
+    } // 对mapping后的数据过滤，scale保持不变
+
   }, {
     key: "filter",
     value: function filter(field, values, updateOptions) {
@@ -464,7 +461,7 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
         field: field,
         values: values
       };
-      this.updateStyleAttribute('shape', field, values, updateOptions);
+      this.updateStyleAttribute('shape', field, values, updateOptions); // TODO: 根据 shape 判断是否需要更新 model
 
       if (!this.tileLayer) {
         updateShape(this, lastShape, currentShape);
@@ -488,7 +485,7 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     value: function animate(options) {
       var rawAnimate = {};
 
-      if (_isObject(options)) {
+      if (isObject(options)) {
         rawAnimate.enable = true;
         rawAnimate = _objectSpread(_objectSpread({}, rawAnimate), options);
       } else {
@@ -497,13 +494,15 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
 
       this.updateLayerConfig({
         animateOption: rawAnimate
-      });
+      }); // this.animateOptions = options;
+
       return this;
     }
   }, {
     key: "source",
     value: function source(data, options) {
       if (data !== null && data !== void 0 && data.data) {
+        // 判断是否为source
         this.setSource(data);
         return this;
       }
@@ -527,12 +526,14 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
           var currentSource = _this4.getSource();
 
           if (!currentSource) {
+            // 执行 setData 的时候 source 还不存在（还未执行 addLayer）
             _this4.source(new Source(data, options));
 
             _this4.sourceEvent();
           } else {
             _this4.layerSource.setData(data, options);
-          }
+          } // this.layerSource.setData(data, options);
+
         });
       }
 
@@ -546,7 +547,8 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
       var lastConfig = this.getLayerConfig();
 
       var passes = options.passes,
-          rest = _objectWithoutProperties(options, _excluded);
+          rest = _objectWithoutProperties(options, _excluded); // passes 特殊处理
+
 
       if (passes) {
         normalizePasses(passes).forEach(function (pass) {
@@ -563,7 +565,8 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
       if (this.container) {
         this.updateLayerConfig(this.rawConfig);
         this.styleNeedUpdate = true;
-      }
+      } // @ts-ignore
+
 
       if (lastConfig && lastConfig.mask === true && options.mask === false) {
         this.clearModels();
@@ -577,7 +580,7 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
   }, {
     key: "scale",
     value: function scale(field, cfg) {
-      if (_isObject(field)) {
+      if (isObject(field)) {
         this.scaleOptions = _objectSpread(_objectSpread({}, this.scaleOptions), field);
       } else {
         this.scaleOptions[field] = cfg;
@@ -585,6 +588,10 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
 
       return this;
     }
+    /**
+     * 渲染所有的图层
+     */
+
   }, {
     key: "renderLayers",
     value: function renderLayers() {
@@ -596,9 +603,11 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     key: "render",
     value: function render() {
       if (this.tileLayer !== undefined) {
+        // 瓦片图层执行单独的 render 渲染队列
         this.tileLayer.render();
         return this;
-      }
+      } // TODO: this.getEncodedData().length !== 0 这个判断是为了解决在 2.5.x 引入数据纹理后产生的 空数据渲染导致 texture 超出上限问题
+
 
       if (this.getEncodedData() && this.getEncodedData().length !== 0) {
         this.renderModels();
@@ -606,10 +615,14 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
 
       return this;
     }
+    /**
+     * renderMultiPass 专门用于渲染支持 multipass 的 layer
+     */
+
   }, {
     key: "renderMultiPass",
     value: function () {
-      var _renderMultiPass = _asyncToGenerator(_regeneratorRuntime.mark(function _callee() {
+      var _renderMultiPass = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
         return _regeneratorRuntime.wrap(function _callee$(_context) {
           while (1) {
             switch (_context.prev = _context.next) {
@@ -633,6 +646,7 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
 
               case 6:
                 if (this.multiPassRenderer) {
+                  // renderPass 触发的渲染
                   this.renderModels();
                 } else {
                   this.renderModels();
@@ -656,9 +670,9 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     key: "active",
     value: function active(options) {
       var activeOption = {};
-      activeOption.enableHighlight = _isObject(options) ? true : options;
+      activeOption.enableHighlight = isObject(options) ? true : options;
 
-      if (_isObject(options)) {
+      if (isObject(options)) {
         activeOption.enableHighlight = true;
 
         if (options.color) {
@@ -680,14 +694,14 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     value: function setActive(id, options) {
       var _this6 = this;
 
-      if (_isObject(id)) {
+      if (isObject(id)) {
         var _id$x = id.x,
             x = _id$x === void 0 ? 0 : _id$x,
             _id$y = id.y,
             y = _id$y === void 0 ? 0 : _id$y;
         this.updateLayerConfig({
-          highlightColor: _isObject(options) ? options.color : this.getLayerConfig().highlightColor,
-          activeMix: _isObject(options) ? options.mix : this.getLayerConfig().activeMix
+          highlightColor: isObject(options) ? options.color : this.getLayerConfig().highlightColor,
+          activeMix: isObject(options) ? options.mix : this.getLayerConfig().activeMix
         });
         this.pick({
           x: x,
@@ -696,10 +710,11 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
       } else {
         this.updateLayerConfig({
           pickedFeatureID: id,
-          highlightColor: _isObject(options) ? options.color : this.getLayerConfig().highlightColor,
-          activeMix: _isObject(options) ? options.mix : this.getLayerConfig().activeMix
+          highlightColor: isObject(options) ? options.color : this.getLayerConfig().highlightColor,
+          activeMix: isObject(options) ? options.mix : this.getLayerConfig().activeMix
         });
-        this.hooks.beforeSelect.call(encodePickingColor(id)).then(function () {
+        this.hooks.beforeSelect.call(encodePickingColor(id)) // @ts-ignore
+        .then(function () {
           setTimeout(function () {
             _this6.reRender();
           }, 1);
@@ -710,9 +725,9 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     key: "select",
     value: function select(option) {
       var activeOption = {};
-      activeOption.enableSelect = _isObject(option) ? true : option;
+      activeOption.enableSelect = isObject(option) ? true : option;
 
-      if (_isObject(option)) {
+      if (isObject(option)) {
         activeOption.enableSelect = true;
 
         if (option.color) {
@@ -734,14 +749,14 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     value: function setSelect(id, options) {
       var _this7 = this;
 
-      if (_isObject(id)) {
+      if (isObject(id)) {
         var _id$x2 = id.x,
             x = _id$x2 === void 0 ? 0 : _id$x2,
             _id$y2 = id.y,
             y = _id$y2 === void 0 ? 0 : _id$y2;
         this.updateLayerConfig({
-          selectColor: _isObject(options) ? options.color : this.getLayerConfig().selectColor,
-          selectMix: _isObject(options) ? options.mix : this.getLayerConfig().selectMix
+          selectColor: isObject(options) ? options.color : this.getLayerConfig().selectColor,
+          selectMix: isObject(options) ? options.mix : this.getLayerConfig().selectMix
         });
         this.pick({
           x: x,
@@ -750,10 +765,11 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
       } else {
         this.updateLayerConfig({
           pickedFeatureID: id,
-          selectColor: _isObject(options) ? options.color : this.getLayerConfig().selectColor,
-          selectMix: _isObject(options) ? options.mix : this.getLayerConfig().selectMix
+          selectColor: isObject(options) ? options.color : this.getLayerConfig().selectColor,
+          selectMix: isObject(options) ? options.mix : this.getLayerConfig().selectMix
         });
-        this.hooks.beforeSelect.call(encodePickingColor(id)).then(function () {
+        this.hooks.beforeSelect.call(encodePickingColor(id)) // @ts-ignore
+        .then(function () {
           setTimeout(function () {
             _this7.reRender();
           }, 1);
@@ -783,6 +799,7 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     key: "hide",
     value: function hide() {
       if (this.type === 'CanvasLayer' && this.layerModel.clearCanvas) {
+        // 对 canvasLayer 的 hide 操作做特殊处理
         this.layerModel.clearCanvas();
       }
 
@@ -891,7 +908,8 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
   }, {
     key: "get",
     value: function get(name) {
-      var cfg = this.getLayerConfig();
+      var cfg = this.getLayerConfig(); // @ts-ignore
+
       return cfg[name];
     }
   }, {
@@ -910,6 +928,10 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
       });
       return this;
     }
+    /**
+     * zoom to layer Bounds
+     */
+
   }, {
     key: "fitBounds",
     value: function fitBounds(fitBoundsOptions) {
@@ -942,21 +964,28 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
 
       if (this.isDestroied) {
         return;
-      }
+      } // remove child layer
+
 
       this.layerChildren.map(function (child) {
         return child.destroy();
       });
-      this.layerChildren = [];
+      this.layerChildren = []; // remove mask list
+
       this.masks.map(function (mask) {
         return mask.destroy();
       });
       this.masks = [];
-      this.hooks.beforeDestroy.call();
+      this.hooks.beforeDestroy.call(); // 清除sources事件
+
       this.layerSource.off('sourceUpdate', this.sourceEvent);
-      this.multiPassRenderer.destroy();
-      this.styleAttributeService.clearAllAttributes();
-      this.hooks.afterDestroy.call();
+      this.multiPassRenderer.destroy(); // console.log(this.styleAttributeService.getAttributes())
+      // 清除所有属性以及关联的 vao == 销毁所有 => model this.models.forEach((model) => model.destroy());
+
+      this.styleAttributeService.clearAllAttributes(); // 执行每个图层单独的 clearModels 方法 （清除一些额外的 texture、program、buffer 等）
+
+      this.hooks.afterDestroy.call(); // TODO: 清除各个图层自定义的 models 资源
+
       (_this$layerModel2 = this.layerModel) === null || _this$layerModel2 === void 0 ? void 0 : _this$layerModel2.clearModels();
       this.models = [];
       this.layerService.cleanRemove(this, refresh);
@@ -968,13 +997,15 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
         target: this,
         type: 'destroy'
       });
-      this.removeAllListeners();
+      this.removeAllListeners(); // 解绑图层容器中的服务
+      // this.container.unbind(TYPES.IStyleAttributeService);
+
       this.isDestroied = true;
     }
   }, {
     key: "clear",
     value: function clear() {
-      this.styleAttributeService.clearAllAttributes();
+      this.styleAttributeService.clearAllAttributes(); // 销毁所有 model
     }
   }, {
     key: "clearModels",
@@ -999,21 +1030,24 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     value: function setSource(source) {
       var _this8 = this;
 
+      // 清除旧 sources 事件
       if (this.layerSource) {
         this.layerSource.off('sourceUpdate', this.sourceEvent);
       }
 
       this.layerSource = source;
-      this.clusterZoom = 0;
+      this.clusterZoom = 0; // 已 inited 且启用聚合进行更新聚合数据
 
       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 后，sourceUpdate 事件不会再触发
+
 
       this.layerSource.on('sourceUpdate', function () {
         _this8.sourceEvent();
@@ -1047,13 +1081,14 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
   }, {
     key: "getLegendItems",
     value: function getLegendItems(name) {
-      var scale = this.styleAttributeService.getLayerAttributeScale(name);
+      var scale = this.styleAttributeService.getLayerAttributeScale(name); // 函数自定义映射，没有 scale 返回为空数组
 
       if (!scale) {
         return [];
       }
 
       if (scale.invertExtent) {
+        // 分段类型  Quantize、Quantile、Threshold
         var items = scale.range().map(function (item) {
           return _defineProperty({
             value: scale.invertExtent(item)
@@ -1061,6 +1096,7 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
         });
         return items;
       } else if (scale.ticks) {
+        // 连续类型 Continuous (Linear, Power, Log, Identity, Time)
         var _items = scale.ticks().map(function (item) {
           return _defineProperty({
             value: item
@@ -1069,8 +1105,9 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
 
         return _items;
       } else if (scale !== null && scale !== void 0 && scale.domain) {
+        // 枚举类型 Cat
         var _items2 = scale.domain().filter(function (item) {
-          return !_isUndefined(item);
+          return !isUndefined(item);
         }).map(function (item) {
           return _defineProperty({
             value: item
@@ -1084,9 +1121,9 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     }
   }, {
     key: "pick",
-    value: function pick(_ref5) {
-      var x = _ref5.x,
-          y = _ref5.y;
+    value: function pick(_ref6) {
+      var x = _ref6.x,
+          y = _ref6.y;
       this.interactionService.triggerHover({
         x: x,
         y: y
@@ -1124,10 +1161,11 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
 
       var createModel = this.rendererService.createModel;
       return new Promise(function (resolve, reject) {
+        // filter supported worker & worker enabled layer
         if (workerOptions && workerOptions.modelType in WorkerSourceMap && workerEnabled) {
-          _this9.styleAttributeService.createAttributesAndIndicesAscy(_this9.encodedData, segmentNumber, workerOptions).then(function (_ref6) {
-            var attributes = _ref6.attributes,
-                elements = _ref6.elements;
+          _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,
@@ -1160,7 +1198,7 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
   }, {
     key: "createAttrubutes",
     value: function createAttrubutes(options) {
-      var triangulation = options.triangulation;
+      var triangulation = options.triangulation; // @ts-ignore
 
       var _this$styleAttributeS4 = this.styleAttributeService.createAttributes(this.encodedData, triangulation),
           attributes = _this$styleAttributeS4.attributes;
@@ -1202,7 +1240,8 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
           _this$getLayerConfig11 = _this$getLayerConfig10.enableHighlight,
           enableHighlight = _this$getLayerConfig11 === void 0 ? true : _this$getLayerConfig11,
           _this$getLayerConfig12 = _this$getLayerConfig10.enableSelect,
-          enableSelect = _this$getLayerConfig12 === void 0 ? true : _this$getLayerConfig12;
+          enableSelect = _this$getLayerConfig12 === void 0 ? true : _this$getLayerConfig12; // 判断layer是否监听事件;
+
 
       var isPick = this.eventNames().indexOf(type) !== -1 || this.eventNames().indexOf('un' + type) !== -1;
 
@@ -1229,7 +1268,7 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
   }, {
     key: "renderMulPass",
     value: function () {
-      var _renderMulPass = _asyncToGenerator(_regeneratorRuntime.mark(function _callee2(multiPassRenderer) {
+      var _renderMulPass = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(multiPassRenderer) {
         return _regeneratorRuntime.wrap(function _callee2$(_context2) {
           while (1) {
             switch (_context2.prev = _context2.next) {
@@ -1256,6 +1295,7 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     value: function renderModels(isPicking) {
       var _this10 = this;
 
+      // TODO: this.getEncodedData().length > 0 这个判断是为了解决在 2.5.x 引入数据纹理后产生的 空数据渲染导致 texture 超出上限问题
       if (this.getEncodedData() && this.getEncodedData().length > 0) {
         var _this$layerModel4;
 
@@ -1294,10 +1334,14 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
         });
       } else {
         this.styleAttributeService.updateStyleAttribute(type, {
+          // @ts-ignore
           scale: _objectSpread({
             field: field
-          }, this.splitValuesAndCallbackInAttribute(values, this.getLayerConfig()[field]))
-        }, updateOptions);
+          }, this.splitValuesAndCallbackInAttribute( // @ts-ignore
+          values, // @ts-ignore
+          this.getLayerConfig()[field]))
+        }, // @ts-ignore
+        updateOptions);
       }
     }
   }, {
@@ -1305,6 +1349,11 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     value: function getShaderPickStat() {
       return this.layerService.getShaderPickStat();
     }
+    /**
+     * 继承空方法
+     * @param time
+     */
+
   }, {
     key: "setEarthTime",
     value: function setEarthTime(time) {
@@ -1337,8 +1386,8 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
     key: "splitValuesAndCallbackInAttribute",
     value: function splitValuesAndCallbackInAttribute(valuesOrCallback, defaultValues) {
       return {
-        values: _isFunction(valuesOrCallback) ? undefined : valuesOrCallback || defaultValues,
-        callback: _isFunction(valuesOrCallback) ? valuesOrCallback : undefined
+        values: isFunction(valuesOrCallback) ? undefined : valuesOrCallback || defaultValues,
+        callback: isFunction(valuesOrCallback) ? valuesOrCallback : undefined
       };
     }
   }]);
@@ -1350,5 +1399,4 @@ var BaseLayer = (_dec = lazyInject(TYPES.IGlobalConfigService), (_class = functi
   writable: true,
   initializer: null
 })), _class));
-export { BaseLayer as default };
-//# sourceMappingURL=BaseLayer.js.map
+export { BaseLayer as default };