@antv/l7-core - npm Package Compare versions

Comparing version 2.10.1 to 2.10.2

es/services/asset/FontService.js

@@ -249,3 +249,5 @@ import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 
-      var ctx = canvas.getContext('2d');
+      var ctx = canvas.getContext('2d', {
+        willReadFrequently: true
+      });
       setTextStyle(ctx, fontFamily, fontSize, fontWeight); // 1. build mapping
@@ -252,0 +254,0 @@

es/services/config/ConfigService.d.ts

 import 'reflect-metadata';
-import { ILayerConfig } from '../layer/ILayerService';
+import { ILayerConfig, ILayerAttributesOption } from '../layer/ILayerService';
 import { IGlobalConfigService, ISceneConfig } from './IConfigService';
@@ -20,2 +20,6 @@ export default class GlobalConfigService implements IGlobalConfigService {
     /**
+     * 数据映射缓存
+     */
+    private layerAttributeConfigCache;
+    /**
      * 保存每一种 Layer 配置项的校验器
@@ -28,3 +32,5 @@ */
     setLayerConfig(sceneId: string, layerId: string, config: Partial<ILayerConfig>): void;
+    getAttributeConfig(layerId: string): Partial<ILayerAttributesOption>;
+    setAttributeConfig(layerId: string, attr: Partial<ILayerAttributesOption>): void;
     clean(): void;
 }

es/services/config/ConfigService.js

@@ -53,3 +53,3 @@ import _objectSpread from "@babel/runtime/helpers/objectSpread2";
   enableHighlight: false,
-  enableSelect: false,
+  enableSelect: true,
   highlightColor: '#2f54eb',
@@ -83,2 +83,4 @@ activeMix: 0,
     _defineProperty(this, "layerConfigCache", {});
+
+    _defineProperty(this, "layerAttributeConfigCache", {});
   }
@@ -125,12 +127,15 @@
       this.layerConfigCache[layerId] = _objectSpread({}, merge({}, this.sceneConfigCache[sceneId], defaultLayerConfig, config));
-    } // public registerLayerConfigSchemaValidator(layerName: string, schema: object) {
-    //   if (!this.layerConfigValidatorCache[layerName]) {
-    //     this.layerConfigValidatorCache[layerName] = ajv.compile(schema);
-    //   }
-    // }
-    // public validateLayerConfig(layerName: string, data: object) {
-    //   return this.validate(this.layerConfigValidatorCache[layerName], data);
-    // }
-
+    }
   }, {
+    key: "getAttributeConfig",
+    value: function getAttributeConfig(layerId) {
+      return this.layerAttributeConfigCache[layerId];
+    }
+  }, {
+    key: "setAttributeConfig",
+    value: function setAttributeConfig(layerId, attr) {
+      // TODO
+      this.layerAttributeConfigCache[layerId] = _objectSpread(_objectSpread({}, this.layerAttributeConfigCache[layerId]), attr);
+    }
+  }, {
     key: "clean",
@@ -137,0 +142,0 @@ value: function clean() {

es/services/config/IConfigService.d.ts

 import { PositionName } from '../component/IControlService';
-import { ILayerConfig } from '../layer/ILayerService';
+import { ILayerConfig, ILayerAttributesOption } from '../layer/ILayerService';
 import { IMapWrapper } from '../map/IMapService';
@@ -51,10 +51,11 @@ import { IRenderConfig } from '../renderer/IRendererService';
     /**
-     * 注册一个图层的配置项校验器
-     * @param layerName 图层名
-     * @param schema 校验规则描述
-     */
+   * 获取数据映射
+   */
+    getAttributeConfig(layerId: string): Partial<ILayerAttributesOption>;
     /**
-     * 校验用户传入的图层配置项
-     * @param data 图层配置项
+     * 设置数据映射
+     * @param layerId sh
+     * @param attr
      */
+    setAttributeConfig(layerId: string, attr: Partial<ILayerAttributesOption>): void;
     /**
@@ -61,0 +62,0 @@ * 清除场景和图层配置项 Cache，但是需要保留校验器

es/services/interaction/IPickingService.d.ts

@@ -12,1 +12,23 @@ import { IInteractionTarget } from '../interaction/IInteractionService';
 }
+export interface ILayerPickService {
+    /**
+     * 绘制拾取图层
+     * @param target 触发对象
+     */
+    pickRender(target: IInteractionTarget): void;
+    /**
+     * 为图层设置选中对象
+     * @param pickedColors
+     */
+    selectFeature(pickedColors: Uint8Array | undefined): void;
+    /**
+     * 为图层设置active对象
+     * @param pickedColors
+     */
+    highlightPickedFeature(pickedColors: Uint8Array | undefined): void;
+    /**
+     * 获取选中的要素
+     * @param id q
+     */
+    getFeatureById(id: number): any;
+}

es/services/interaction/PickingService.js

@@ -98,3 +98,3 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
         var pickedFeatureIdx = decodePickingColor(pickedColors);
-        var rawFeature = layer.getSource().getFeatureById(pickedFeatureIdx);
+        var rawFeature = layer.layerPickService.getFeatureById(pickedFeatureIdx);
 
@@ -148,3 +148,3 @@ if (pickedFeatureIdx !== layer.getCurrentPickId() && type === 'mousemove') {
       if (enableHighlight) {
-        _this.highlightPickedFeature(layer, pickedColors);
+        layer.layerPickService.highlightPickedFeature(pickedColors);
       }
@@ -156,20 +156,9 @@
         if (layer.getCurrentSelectedId() === null || selectedId !== layer.getCurrentSelectedId()) {
-          _this.selectFeature(layer, pickedColors);
-
+          layer.layerPickService.selectFeature(pickedColors);
           layer.setCurrentSelectedId(selectedId);
         } else {
-          _this.selectFeature(layer, new Uint8Array([0, 0, 0, 0])); // toggle select
+          layer.layerPickService.selectFeature(new Uint8Array([0, 0, 0, 0])); // toggle select
 
-
           layer.setCurrentSelectedId(null);
         }
-
-        if (!layer.isVector) {
-          // Tip: 选中普通 layer 的时候将 tileLayer 的选中状态清除
-          _this.layerService.getLayers().filter(function (l) {
-            return l.tileLayer;
-          }).map(function (l) {
-            l.tileLayer.clearPickState();
-          });
-        }
       }
@@ -301,3 +290,3 @@
         if (pickedFeatureIdx !== -1 && !featuresIdMap[pickedFeatureIdx]) {
-          var rawFeature = layer.getSource().getFeatureById(pickedFeatureIdx);
+          var rawFeature = layer.layerPickService.getFeatureById(pickedFeatureIdx);
           features.push(_objectSpread(_objectSpread({}, rawFeature), {}, {
@@ -457,29 +446,24 @@ pickedFeatureIdx: pickedFeatureIdx
                     }); // Tip: clear last picked tilelayer state
+                    // this.pickedTileLayers.map((pickedTileLayer) =>
+                    //   (pickedTileLayer.tileLayer as ITileLayer)?.clearPick(target.type),
+                    // );
+                    // Tip: 如果当前 layer 是瓦片图层，则走瓦片图层独立的拾取逻辑
+                    // if (layer.tileLayer && (layer.tileLayer as ITileLayer).pickLayers) {
+                    //   return (layer.tileLayer as ITileLayer).pickLayers(target);
+                    // }
+                    // 将当前的 layer 绘制到 pickingFBO
+                    // 普通图层和瓦片图层的 layerPickService 拥有不同的 pickRender 方法
 
-                    _this4.pickedTileLayers.map(function (pickedTileLayer) {
-                      var _pickedTileLayer$tile;
+                    layer.layerPickService.pickRender(target); // layer.hooks.beforePickingEncode.call();
+                    // if (layer.masks.length > 0) {
+                    //   // 若存在 mask，则在 pick 阶段的绘制也启用
+                    //   layer.masks.map(async (m: ILayer) => {
+                    //     m.hooks.beforeRender.call();
+                    //     m.render();
+                    //     m.hooks.afterRender.call();
+                    //   });
+                    // }
+                    // layer.renderModels(true);
+                    // layer.hooks.afterPickingEncode.call();
 
-                      return (_pickedTileLayer$tile = pickedTileLayer.tileLayer) === null || _pickedTileLayer$tile === void 0 ? void 0 : _pickedTileLayer$tile.clearPick(target.type);
-                    }); // Tip: 如果当前 layer 是瓦片图层，则走瓦片图层独立的拾取逻辑
-
-
-                    if (layer.tileLayer && layer.tileLayer.pickLayers) {
-                      return layer.tileLayer.pickLayers(target);
-                    }
-
-                    layer.hooks.beforePickingEncode.call();
-
-                    if (layer.masks.length > 0) {
-                      // 若存在 mask，则在 pick 阶段的绘制也启用
-                      layer.masks.map(function (m) {
-                        m.hooks.beforeRenderData.call();
-                        m.hooks.beforeRender.call();
-                        m.render();
-                        m.hooks.afterRender.call();
-                      });
-                    }
-
-                    layer.renderModels(true);
-                    layer.hooks.afterPickingEncode.call();
-
                     var isPicked = _this4.pickFromPickingFBO(layer, target);
@@ -486,0 +470,0 @@

es/services/layer/ILayerService.d.ts

@@ -1,3 +0,3 @@
-import { SyncBailHook, SyncHook, SyncWaterfallHook } from '@antv/async-hook';
-import { IColorRamp, Tile, TilesetManager } from '@antv/l7-utils';
+import { SyncBailHook, SyncHook, AsyncSeriesBailHook, AsyncWaterfallHook } from '@antv/async-hook';
+import { IColorRamp, SourceTile, TilesetManager } from '@antv/l7-utils';
 import { Container } from 'inversify';
@@ -7,3 +7,3 @@ import Clock from '../../utils/clock';
 import { IInteractionTarget } from '../interaction/IInteractionService';
-import { IPickingService } from '../interaction/IPickingService';
+import { ILayerPickService, IPickingService } from '../interaction/IPickingService';
 import { IMapService } from '../map/IMapService';
@@ -16,3 +16,3 @@ import { IAttribute } from '../renderer/IAttribute';
 import { IUniform } from '../renderer/IUniform';
-import { ISource, ISourceCFG, ITransform } from '../source/ISourceService';
+import { ISource, ISourceCFG, ITransform, IParseDataItem } from '../source/ISourceService';
 import { IAnimateOption, IEncodeFeature, IScale, IScaleOptions, IScaleValue, IStyleAttribute, IStyleAttributeService, IStyleAttributeUpdateOptions, ScaleTypeName, StyleAttrField, StyleAttributeField, StyleAttributeOption, Triangulation } from './IStyleAttributeService';
@@ -56,4 +56,4 @@ export declare enum BlendType {
     getAnimateUniforms(): IModelUniform;
-    buildModels(callbackModel: (models: IModel[]) => void): void;
-    initModels(callbackModel: (models: IModel[]) => void): void;
+    buildModels(): Promise<IModel[]>;
+    initModels(): Promise<IModel[]>;
     needUpdate(): boolean;
@@ -65,2 +65,11 @@ clearModels(refresh?: boolean): void;
 }
+export interface ILayerAttributesOption {
+    shape: IAttrbuteOptions;
+    color: IAttrbuteOptions;
+    texture: IAttrbuteOptions;
+    rotate: IAttrbuteOptions;
+    size: IAttrbuteOptions;
+    filter: IAttrbuteOptions;
+    label: IAttrbuteOptions;
+}
 export interface IModelUniform {
@@ -105,2 +114,6 @@ [key: string]: IUniform;
 }
+export interface IAttrbuteOptions {
+    field: StyleAttrField;
+    values: StyleAttributeOption;
+}
 /**
@@ -113,2 +126,3 @@ * For tile subLayer
     transforms?: ITransform[];
+    visible: boolean;
     shape?: string | string[] | IScaleValue;
@@ -144,11 +158,8 @@ zIndex: number;
     children: ILayer[];
-    addTile(tile: Tile): {
+    addTile(tile: SourceTile): Promise<{
         layers: ILayer[];
-        layerIDList: string[];
-    };
+    }>;
     addChild(layer: ILayer): void;
     addChildren(layers: ILayer[]): void;
-    getChildren(layerIDList: string[]): ILayer[];
     removeChild(layer: ILayer): void;
-    removeChildren(layerIDList: string[], refresh?: boolean): void;
     clearChild(): void;
@@ -159,27 +170,57 @@ hasChild(layer: ILayer): boolean;
 }
-export interface ITileRenderService {
-    render(layers: ILayer[]): void;
-    renderMask(layers: ILayer): void;
+export interface ITilePickService {
+    pickRender(target: IInteractionTarget): void;
 }
-export interface ITilePickService {
-    isLastPicked: boolean;
-    on(type: string, cb: (option: any) => void): void;
-    beforeHighlight(pickedColors: any): void;
-    beforeSelect(pickedColors: any): void;
-    clearPick(): void;
-    pick(layers: ILayer[], target: IInteractionTarget): boolean;
+export interface ITile {
+    x: number;
+    y: number;
+    z: number;
+    key: string;
+    sourceTile: SourceTile;
+    visible: boolean;
+    isLoaded: boolean;
+    getLayers(): ILayer[];
+    styleUpdate(...args: any): void;
+    initTileLayer(): Promise<void>;
+    lnglatInBounds(lnglat: {
+        lng: number;
+        lat: number;
+    }): boolean;
+    updateVisible(value: boolean): void;
+    updateOptions(key: string, value: any): void;
     destroy(): void;
 }
-export interface ITileLayerManager extends IBaseTileLayerManager {
-    tilePickService: ITilePickService;
-    pickLayers(target: IInteractionTarget): boolean;
+export interface ITile {
+    x: number;
+    y: number;
+    z: number;
+    key: string;
+    sourceTile: SourceTile;
+    visible: boolean;
+    isLoaded: boolean;
+    getLayers(): ILayer[];
+    styleUpdate(...args: any): void;
+    initTileLayer(): Promise<void>;
+    lnglatInBounds(lnglat: {
+        lng: number;
+        lat: number;
+    }): boolean;
+    updateVisible(value: boolean): void;
+    updateOptions(key: string, value: any): void;
     destroy(): void;
 }
+export interface ITileLayerService {
+    tileResource: Map<string, any>;
+    hasTile(tileKey: string): boolean;
+    getLayers(): ILayer[];
+    getTiles(): ITile[];
+}
 export interface IBaseTileLayer {
-    sourceLayer: string;
-    parent: ILayer;
-    tileLayerManager: IBaseTileLayerManager;
     tilesetManager: TilesetManager | undefined;
-    children: ILayer[];
-    scaleField: any;
+    tileLayerService: ITileLayerService;
+    getLayers(): ILayer[];
+    getTiles(): ITile[];
+    pickRender(target: IInteractionTarget): void;
+    selectFeature(pickedColors: Uint8Array | undefined): void;
+    highlightPickedFeature(pickedColors: Uint8Array | undefined): void;
     render(isPicking?: boolean): void;
@@ -189,3 +230,3 @@ destroy(): void;
 export interface ITileLayer extends IBaseTileLayer {
-    tileLayerManager: ITileLayerManager;
+    pickRender(target: IInteractionTarget): void;
     pickLayers(target: IInteractionTarget): boolean;
@@ -206,2 +247,6 @@ clearPick(type: string): void;
 export interface ILayer {
+    styleAttributeService: IStyleAttributeService;
+    layerPickService: ILayerPickService;
+    sourceLayer?: string;
+    parent: ILayer;
     id: string;
@@ -212,2 +257,3 @@ type: string;
     inited: boolean;
+    startInit: boolean;
     zIndex: number;
@@ -218,3 +264,2 @@ clusterZoom: number;
     styleNeedUpdate: boolean;
-    modelLoaded: boolean;
     layerModel: ILayerModel;
@@ -233,5 +278,5 @@ tileLayer: IBaseTileLayer;
     hooks: {
-        init: SyncBailHook;
+        init: AsyncSeriesBailHook;
         afterInit: SyncBailHook;
-        beforeRenderData: SyncWaterfallHook;
+        beforeRenderData: AsyncWaterfallHook;
         beforeRender: SyncBailHook;
@@ -255,5 +300,5 @@ afterRender: SyncHook;
     layerType?: string | undefined;
-    isVector?: boolean;
     isTileLayer?: boolean;
     triangulation?: Triangulation | undefined;
+    processData(data: IParseDataItem[]): IParseDataItem[];
     /**
@@ -267,2 +312,4 @@ * threejs 适配兼容相关的方法
     threeRenderService?: any;
+    postProcessingPassFactory: (name: string) => IPostProcessingPass<unknown>;
+    normalPassFactory: (name: string) => IPass<unknown>;
     getShaderPickStat: () => boolean;
@@ -274,5 +321,4 @@ updateModelData(data: IAttributeAndElements): void;
     getAttribute(name: string): IStyleAttribute | undefined;
-    getLayerConfig(): Partial<ILayerConfig & ISceneConfig>;
-    setBottomColor(color: string): void;
-    getBottomColor(): string;
+    getLayerConfig<T>(): Partial<ILayerConfig & ISceneConfig & T>;
+    getLayerAttributeConfig(): Partial<ILayerAttributesOption>;
     getContainer(): Container;
@@ -288,2 +334,3 @@ setContainer(container: Container, sceneContainer: Container): void;
     rebuildModels(): void;
+    getModelType(): string;
     buildLayerModel(options: ILayerModelInitializationOptions & Partial<IModelInitializationOptions>): Promise<IModel>;
@@ -294,3 +341,4 @@ createAttributes(options: ILayerModelInitializationOptions & Partial<IModelInitializationOptions>): {
     updateStyleAttribute(type: string, field: StyleAttributeField, values?: StyleAttributeOption, updateOptions?: Partial<IStyleAttributeUpdateOptions>): void;
-    init(): ILayer;
+    setLayerPickService(layerPickService: ILayerPickService): void;
+    init(): Promise<void>;
     scale(field: string | number | IScaleOptions, cfg?: IScale): ILayer;
@@ -349,2 +397,3 @@ getScale(name: string): any;
     setSource(source: ISource): void;
+    initSource(source: ISource): void;
     setEncodedData(encodedData: IEncodeFeature[]): void;
@@ -408,2 +457,3 @@ getEncodedData(): IEncodeFeature[];
     maskOpacity: number;
+    sourceLayer: string;
     colors: string[];
@@ -502,3 +552,3 @@ size: number;
     addMask(mask: ILayer): void;
-    initLayers(): void;
+    initLayers(): Promise<void>;
     startAnimate(): void;
@@ -516,2 +566,5 @@ stopAnimate(): void;
     reRender(): void;
+    beforeRenderData(layer: ILayer): Promise<void>;
+    renderMask(masks: ILayer[]): void;
+    renderLayer(layer: ILayer): Promise<void>;
     throttleRenderLayers(): void;
@@ -521,4 +574,7 @@ renderLayers(): void;
     getOESTextureFloat(): boolean;
+    pickRender(layer: ILayer, target?: IInteractionTarget): void;
+    selectFeature(layer: ILayer, pickedColors: Uint8Array | undefined): void;
+    highlightPickedFeature(layer: ILayer, pickedColors: Uint8Array | undefined): void;
     destroy(): void;
 }
 export {};

es/services/layer/LayerService.d.ts

 import { EventEmitter } from 'eventemitter3';
 import 'reflect-metadata';
 import Clock from '../../utils/clock';
+import { IInteractionTarget } from '../interaction/IInteractionService';
 import { ILayer, ILayerService, LayerServiceEvent } from './ILayerService';
@@ -22,3 +23,3 @@ export default class LayerService extends EventEmitter<LayerServiceEvent> implements ILayerService {
     addMask(mask: ILayer): void;
-    initLayers(): void;
+    initLayers(): Promise<void>;
     getSceneInited(): boolean;
@@ -34,2 +35,5 @@ getRenderList(): ILayer[];
     renderLayers(): Promise<void>;
+    renderMask(masks: ILayer[]): void;
+    beforeRenderData(layer: ILayer): Promise<void>;
+    renderLayer(layer: ILayer): Promise<void>;
     updateLayerRenderList(): void;
@@ -43,2 +47,5 @@ destroy(): void;
     getShaderPickStat(): boolean;
+    pickRender(layer: ILayer, target: IInteractionTarget): void;
+    selectFeature(layer: ILayer, pickedColors: Uint8Array | undefined): void;
+    highlightPickedFeature(layer: ILayer, pickedColors: Uint8Array | undefined): void;
     clear(): void;
@@ -45,0 +52,0 @@ private runRender;

es/services/layer/LayerService.js

@@ -0,1 +1,2 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
@@ -15,4 +16,2 @@ import _initializerDefineProperty from "@babel/runtime/helpers/initializerDefineProperty";
 
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-
 function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
@@ -24,2 +23,4 @@
 
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+
 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); }; }
@@ -92,9 +93,13 @@
     value: function add(layer) {
+      var _this2 = this;
+
+      this.layers.push(layer);
+
       if (this.sceneInited) {
-        layer.init();
+        layer.init().then(function () {
+          _this2.updateLayerRenderList();
+
+          _this2.renderLayers();
+        });
       }
-
-      this.layers.push(layer);
-      this.updateLayerRenderList();
-      this.emit('layerChange', this.layers);
     }
@@ -104,4 +109,8 @@ }, {
     value: function addMask(mask) {
+      var _this3 = this;
+
       if (this.sceneInited) {
-        mask.init();
+        mask.init().then(function () {
+          _this3.renderLayers();
+        });
       }
@@ -111,11 +120,55 @@ }
     key: "initLayers",
-    value: function initLayers() {
-      this.sceneInited = true;
-      this.layers.forEach(function (layer) {
-        if (!layer.inited) {
-          layer.init();
-        }
-      });
-      this.updateLayerRenderList();
-    }
+    value: function () {
+      var _initLayers = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+        var _this4 = this;
+
+        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+          while (1) {
+            switch (_context2.prev = _context2.next) {
+              case 0:
+                this.sceneInited = true;
+                this.layers.forEach( /*#__PURE__*/function () {
+                  var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(layer) {
+                    return _regeneratorRuntime.wrap(function _callee$(_context) {
+                      while (1) {
+                        switch (_context.prev = _context.next) {
+                          case 0:
+                            if (layer.startInit) {
+                              _context.next = 4;
+                              break;
+                            }
+
+                            _context.next = 3;
+                            return layer.init();
+
+                          case 3:
+                            _this4.updateLayerRenderList();
+
+                          case 4:
+                          case "end":
+                            return _context.stop();
+                        }
+                      }
+                    }, _callee);
+                  }));
+
+                  return function (_x) {
+                    return _ref2.apply(this, arguments);
+                  };
+                }());
+
+              case 2:
+              case "end":
+                return _context2.stop();
+            }
+          }
+        }, _callee2, this);
+      }));
+
+      function initLayers() {
+        return _initLayers.apply(this, arguments);
+      }
+
+      return initLayers;
+    }()
   }, {
@@ -200,15 +253,15 @@ key: "getSceneInited",
     value: function () {
-      var _renderLayers = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var _renderLayers = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
         var _iterator, _step, layer;
 
-        return _regeneratorRuntime.wrap(function _callee$(_context) {
+        return _regeneratorRuntime.wrap(function _callee4$(_context4) {
           while (1) {
-            switch (_context.prev = _context.next) {
+            switch (_context4.prev = _context4.next) {
               case 0:
                 if (!(this.alreadyInRendering || !this.enableRender)) {
-                  _context.next = 2;
+                  _context4.next = 2;
                   break;
                 }
 
-                return _context.abrupt("return");
+                return _context4.abrupt("return");
 
@@ -219,3 +272,3 @@ case 2:
                 _iterator = _createForOfIteratorHelper(this.layerList);
-                _context.prev = 5;
+                _context4.prev = 5;
 
@@ -226,3 +279,3 @@ _iterator.s();
                 if ((_step = _iterator.n()).done) {
-                  _context.next = 21;
+                  _context4.next = 19;
                   break;
@@ -232,6 +285,6 @@ }
                 layer = _step.value;
-                layer.hooks.beforeRenderData.call();
-                layer.hooks.beforeRender.call();
 
-                if (layer.masks.length > 0) {
+                if (layer.masks.filter(function (m) {
+                  return m.inited;
+                }).length > 0) {
                   // 清除上一次的模版缓存
@@ -243,58 +296,70 @@ this.renderService.clear({
                   });
-                  layer.masks.map(function (m) {
-                    m.hooks.beforeRenderData.call();
-                    m.hooks.beforeRender.call();
-                    m.render();
-                    m.hooks.afterRender.call();
-                  });
+                  layer.masks.map( /*#__PURE__*/function () {
+                    var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(m) {
+                      return _regeneratorRuntime.wrap(function _callee3$(_context3) {
+                        while (1) {
+                          switch (_context3.prev = _context3.next) {
+                            case 0:
+                              m.render();
+
+                            case 1:
+                            case "end":
+                              return _context3.stop();
+                          }
+                        }
+                      }, _callee3);
+                    }));
+
+                    return function (_x2) {
+                      return _ref3.apply(this, arguments);
+                    };
+                  }());
                 }
 
                 if (!layer.getLayerConfig().enableMultiPassRenderer) {
-                  _context.next = 17;
+                  _context4.next = 15;
                   break;
                 }
 
-                _context.next = 15;
+                _context4.next = 13;
                 return layer.renderMultiPass();
 
-              case 15:
-                _context.next = 18;
+              case 13:
+                _context4.next = 17;
                 break;
 
+              case 15:
+                _context4.next = 17;
+                return layer.render();
+
               case 17:
-                layer.render();
+                _context4.next = 7;
+                break;
 
-              case 18:
-                layer.hooks.afterRender.call();
-
               case 19:
-                _context.next = 7;
+                _context4.next = 24;
                 break;
 
               case 21:
-                _context.next = 26;
-                break;
+                _context4.prev = 21;
+                _context4.t0 = _context4["catch"](5);
 
-              case 23:
-                _context.prev = 23;
-                _context.t0 = _context["catch"](5);
+                _iterator.e(_context4.t0);
 
-                _iterator.e(_context.t0);
+              case 24:
+                _context4.prev = 24;
 
-              case 26:
-                _context.prev = 26;
-
                 _iterator.f();
 
-                return _context.finish(26);
+                return _context4.finish(24);
 
-              case 29:
+              case 27:
                 this.alreadyInRendering = false;
 
-              case 30:
+              case 28:
               case "end":
-                return _context.stop();
+                return _context4.stop();
             }
           }
-        }, _callee, this, [[5, 23, 26, 29]]);
+        }, _callee4, this, [[5, 21, 24, 27]]);
       }));
@@ -309,5 +374,98 @@
   }, {
+    key: "renderMask",
+    value: function renderMask(masks) {
+      masks.filter(function (m) {
+        return m.inited;
+      }).map(function (m) {
+        m.render();
+      });
+    }
+  }, {
+    key: "beforeRenderData",
+    value: function () {
+      var _beforeRenderData = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5(layer) {
+        var res;
+        return _regeneratorRuntime.wrap(function _callee5$(_context5) {
+          while (1) {
+            switch (_context5.prev = _context5.next) {
+              case 0:
+                _context5.next = 2;
+                return layer.hooks.beforeRenderData.promise();
+
+              case 2:
+                res = _context5.sent;
+                res && this.renderLayers();
+
+              case 4:
+              case "end":
+                return _context5.stop();
+            }
+          }
+        }, _callee5, this);
+      }));
+
+      function beforeRenderData(_x3) {
+        return _beforeRenderData.apply(this, arguments);
+      }
+
+      return beforeRenderData;
+    }()
+  }, {
+    key: "renderLayer",
+    value: function () {
+      var _renderLayer = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6(layer) {
+        var _this5 = this;
+
+        return _regeneratorRuntime.wrap(function _callee6$(_context6) {
+          while (1) {
+            switch (_context6.prev = _context6.next) {
+              case 0:
+                if (layer.masks.filter(function (m) {
+                  return m.inited;
+                }).length > 0) {
+                  layer.masks.map(function (mask) {
+                    _this5.renderService.clear({
+                      stencil: 0,
+                      depth: 1,
+                      framebuffer: null
+                    });
+
+                    mask.render();
+                  });
+                }
+
+                if (!layer.getLayerConfig().enableMultiPassRenderer) {
+                  _context6.next = 6;
+                  break;
+                }
+
+                _context6.next = 4;
+                return layer.renderMultiPass();
+
+              case 4:
+                _context6.next = 8;
+                break;
+
+              case 6:
+                _context6.next = 8;
+                return layer.render();
+
+              case 8:
+              case "end":
+                return _context6.stop();
+            }
+          }
+        }, _callee6);
+      }));
+
+      function renderLayer(_x4) {
+        return _renderLayer.apply(this, arguments);
+      }
+
+      return renderLayer;
+    }()
+  }, {
     key: "updateLayerRenderList",
     value: function updateLayerRenderList() {
-      var _this2 = this;
+      var _this6 = this;
 
@@ -324,3 +482,3 @@ // Tip: 每次更新都是从 layers 重新构建
       }).forEach(function (layer) {
-        _this2.layerList.push(layer);
+        _this6.layerList.push(layer);
       });
@@ -375,4 +533,66 @@ }
       return this.shaderPicking;
+    } // For Pick
+    // 拾取绘制
+
+  }, {
+    key: "pickRender",
+    value: function pickRender(layer, target) {
+      if (layer.tileLayer) {
+        // 瓦片图层（layerGroup）走独立的拾取渲染
+        return layer.tileLayer.pickRender(target);
+      } // 普通瓦片（单个图层的拾取渲染）
+
+
+      layer.hooks.beforePickingEncode.call();
+
+      if (layer.masks.length > 0) {
+        // 若存在 mask，则在 pick 阶段的绘制也启用
+        layer.masks.map( /*#__PURE__*/function () {
+          var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee7(m) {
+            return _regeneratorRuntime.wrap(function _callee7$(_context7) {
+              while (1) {
+                switch (_context7.prev = _context7.next) {
+                  case 0:
+                    m.render();
+
+                  case 1:
+                  case "end":
+                    return _context7.stop();
+                }
+              }
+            }, _callee7);
+          }));
+
+          return function (_x5) {
+            return _ref4.apply(this, arguments);
+          };
+        }());
+      }
+
+      layer.renderModels(true);
+      layer.hooks.afterPickingEncode.call();
     }
   }, {
+    key: "selectFeature",
+    value: function selectFeature(layer, pickedColors) {
+      if (layer.tileLayer) {
+        return layer.tileLayer.selectFeature(pickedColors);
+      } // @ts-ignore
+
+
+      var _pickedColors = _slicedToArray(pickedColors, 3),
+          r = _pickedColors[0],
+          g = _pickedColors[1],
+          b = _pickedColors[2];
+
+      layer.hooks.beforeSelect.call([r, g, b]);
+    }
+  }, {
+    key: "highlightPickedFeature",
+    value: function highlightPickedFeature(layer, pickedColors) {
+      if (layer.tileLayer) {
+        return layer.tileLayer.highlightPickedFeature(pickedColors);
+      }
+    }
+  }, {
     key: "clear",
@@ -379,0 +599,0 @@ value: function clear() {

es/services/scene/SceneService.js

@@ -259,7 +259,3 @@ import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
         }, _callee2);
-      }))); // TODO：init worker, fontAtlas...
-      // 执行异步并行初始化任务
-      // @ts-ignore
-
-      this.initPromise = this.hooks.init.promise();
+      })));
       this.render();
@@ -408,3 +404,3 @@ }
                 if (this.inited) {
-                  _context5.next = 12;
+                  _context5.next = 16;
                   break;
@@ -414,3 +410,3 @@ }
                 _context5.next = 6;
-                return this.initPromise;
+                return this.hooks.init.promise();
 
@@ -424,3 +420,7 @@ case 6:
 
-                this.layerService.initLayers();
+                _context5.next = 9;
+                return this.layerService.initLayers();
+
+              case 9:
+                this.layerService.renderLayers();
                 this.controlService.addControls();
@@ -430,11 +430,15 @@ this.loaded = true;
                 this.inited = true;
+                _context5.next = 18;
+                break;
 
-              case 12:
+              case 16:
                 // 尝试初始化未初始化的图层
-                this.layerService.updateLayerRenderList();
-                this.layerService.renderLayers(); // 组件需要等待layer 初始化完成之后添加
+                this.layerService.initLayers();
+                this.layerService.renderLayers();
 
+              case 18:
+                // 组件需要等待layer 初始化完成之后添加
                 this.rendering = false;
 
-              case 15:
+              case 19:
               case "end":
@@ -441,0 +445,0 @@ return _context5.stop();

es/services/source/ISourceService.d.ts

 import { TilesetManager } from '@antv/l7-utils';
 import { BBox } from '@turf/helpers';
 export declare type DataType = string | object[] | object;
+export declare type SourceEventType = 'inited' | 'sourceUpdate' | 'update';
+import { RequestParameters } from "@antv/l7-utils";
+export declare enum RasterTileType {
+    IMAGE = "image",
+    ARRAYBUFFER = "arraybuffer",
+    RGB = "rgb"
+}
+export interface IGeojsonvtOptions {
+    maxZoom: number;
+    indexMaxZoom: number;
+    indexMaxPoints: number;
+    tolerance: number;
+    extent: number;
+    buffer: number;
+    lineMetrics: boolean;
+    promoteId: null;
+    generateId: boolean;
+    debug: number;
+}
+export interface ITileParserCFG {
+    type: string;
+    tileSize?: number;
+    minZoom?: number;
+    maxZoom?: number;
+    zoomOffset?: number;
+    extent?: [number, number, number, number];
+    requestParameters: Partial<RequestParameters>;
+    updateStrategy?: 'overlap' | 'replace';
+    featureId?: string;
+    sourceLayer?: string;
+    coord?: string;
+    dataType?: RasterTileType;
+    geojsonvtOptions?: IGeojsonvtOptions;
+    wmtsOptions: IWMTSServiceOption;
+    format?: any;
+    operation?: any;
+}
+export interface IWMTSServiceOption {
+    layer: string;
+    version?: string;
+    style?: string;
+    format: string;
+    service?: string;
+    tileMatrixset: string;
+}
 export interface IParserCfg {
@@ -23,3 +68,4 @@ type: string;
     clusterOptions?: Partial<IClusterOptions>;
-    parser?: IParserCfg;
+    autoRender?: boolean;
+    parser?: IParserCfg | ITileParserCFG;
     transforms?: ITransform[];
@@ -62,2 +108,3 @@ }
     inited: boolean;
+    isTile: boolean;
     data: IParserData;
@@ -71,2 +118,3 @@ center: [number, number];
     tileset: TilesetManager | undefined;
+    getSourceCfg(): any;
     setData(data: any, options?: ISourceCFG): void;
@@ -81,5 +129,5 @@ updateClusterData(zoom: number): void;
     destroy(): void;
-    on(type: string, handler: (...args: any[]) => void): void;
-    off(type: string, handler: (...args: any[]) => void): void;
-    once(type: string, handler: (...args: any[]) => void): void;
+    on(type: SourceEventType | string, handler: (...args: any[]) => void): void;
+    off(type: SourceEventType | string, handler: (...args: any[]) => void): void;
+    once(type: SourceEventType | string, handler: (...args: any[]) => void): void;
 }
@@ -86,0 +134,0 @@ export interface IRasterCfg {

es/services/source/ISourceService.js

@@ -1,1 +0,8 @@
-export {};
+// 栅格瓦片解析配置项
+export var RasterTileType;
+
+(function (RasterTileType) {
+  RasterTileType["IMAGE"] = "image";
+  RasterTileType["ARRAYBUFFER"] = "arraybuffer";
+  RasterTileType["RGB"] = "rgb";
+})(RasterTileType || (RasterTileType = {}));

lib/services/asset/FontService.js

@@ -272,3 +272,5 @@ "use strict";
 
-      var ctx = canvas.getContext('2d');
+      var ctx = canvas.getContext('2d', {
+        willReadFrequently: true
+      });
       setTextStyle(ctx, fontFamily, fontSize, fontWeight); // 1. build mapping
@@ -275,0 +277,0 @@

lib/services/config/ConfigService.js

@@ -67,3 +67,3 @@ "use strict";
   enableHighlight: false,
-  enableSelect: false,
+  enableSelect: true,
   highlightColor: '#2f54eb',
@@ -95,2 +95,3 @@ activeMix: 0,
     (0, _defineProperty2.default)(this, "layerConfigCache", {});
+    (0, _defineProperty2.default)(this, "layerAttributeConfigCache", {});
   }
@@ -137,12 +138,15 @@
       this.layerConfigCache[layerId] = (0, _objectSpread2.default)({}, (0, _lodash.merge)({}, this.sceneConfigCache[sceneId], defaultLayerConfig, config));
-    } // public registerLayerConfigSchemaValidator(layerName: string, schema: object) {
-    //   if (!this.layerConfigValidatorCache[layerName]) {
-    //     this.layerConfigValidatorCache[layerName] = ajv.compile(schema);
-    //   }
-    // }
-    // public validateLayerConfig(layerName: string, data: object) {
-    //   return this.validate(this.layerConfigValidatorCache[layerName], data);
-    // }
-
+    }
   }, {
+    key: "getAttributeConfig",
+    value: function getAttributeConfig(layerId) {
+      return this.layerAttributeConfigCache[layerId];
+    }
+  }, {
+    key: "setAttributeConfig",
+    value: function setAttributeConfig(layerId, attr) {
+      // TODO
+      this.layerAttributeConfigCache[layerId] = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, this.layerAttributeConfigCache[layerId]), attr);
+    }
+  }, {
     key: "clean",
@@ -149,0 +153,0 @@ value: function clean() {

lib/services/interaction/PickingService.js

@@ -110,3 +110,3 @@ "use strict";
         var pickedFeatureIdx = (0, _l7Utils.decodePickingColor)(pickedColors);
-        var rawFeature = layer.getSource().getFeatureById(pickedFeatureIdx);
+        var rawFeature = layer.layerPickService.getFeatureById(pickedFeatureIdx);
 
@@ -160,3 +160,3 @@ if (pickedFeatureIdx !== layer.getCurrentPickId() && type === 'mousemove') {
       if (enableHighlight) {
-        _this.highlightPickedFeature(layer, pickedColors);
+        layer.layerPickService.highlightPickedFeature(pickedColors);
       }
@@ -168,20 +168,9 @@
         if (layer.getCurrentSelectedId() === null || selectedId !== layer.getCurrentSelectedId()) {
-          _this.selectFeature(layer, pickedColors);
-
+          layer.layerPickService.selectFeature(pickedColors);
           layer.setCurrentSelectedId(selectedId);
         } else {
-          _this.selectFeature(layer, new Uint8Array([0, 0, 0, 0])); // toggle select
+          layer.layerPickService.selectFeature(new Uint8Array([0, 0, 0, 0])); // toggle select
 
-
           layer.setCurrentSelectedId(null);
         }
-
-        if (!layer.isVector) {
-          // Tip: 选中普通 layer 的时候将 tileLayer 的选中状态清除
-          _this.layerService.getLayers().filter(function (l) {
-            return l.tileLayer;
-          }).map(function (l) {
-            l.tileLayer.clearPickState();
-          });
-        }
       }
@@ -313,3 +302,3 @@
         if (pickedFeatureIdx !== -1 && !featuresIdMap[pickedFeatureIdx]) {
-          var rawFeature = layer.getSource().getFeatureById(pickedFeatureIdx);
+          var rawFeature = layer.layerPickService.getFeatureById(pickedFeatureIdx);
           features.push((0, _objectSpread2.default)((0, _objectSpread2.default)({}, rawFeature), {}, {
@@ -469,29 +458,24 @@ pickedFeatureIdx: pickedFeatureIdx
                     }); // Tip: clear last picked tilelayer state
+                    // this.pickedTileLayers.map((pickedTileLayer) =>
+                    //   (pickedTileLayer.tileLayer as ITileLayer)?.clearPick(target.type),
+                    // );
+                    // Tip: 如果当前 layer 是瓦片图层，则走瓦片图层独立的拾取逻辑
+                    // if (layer.tileLayer && (layer.tileLayer as ITileLayer).pickLayers) {
+                    //   return (layer.tileLayer as ITileLayer).pickLayers(target);
+                    // }
+                    // 将当前的 layer 绘制到 pickingFBO
+                    // 普通图层和瓦片图层的 layerPickService 拥有不同的 pickRender 方法
 
-                    _this4.pickedTileLayers.map(function (pickedTileLayer) {
-                      var _pickedTileLayer$tile;
+                    layer.layerPickService.pickRender(target); // layer.hooks.beforePickingEncode.call();
+                    // if (layer.masks.length > 0) {
+                    //   // 若存在 mask，则在 pick 阶段的绘制也启用
+                    //   layer.masks.map(async (m: ILayer) => {
+                    //     m.hooks.beforeRender.call();
+                    //     m.render();
+                    //     m.hooks.afterRender.call();
+                    //   });
+                    // }
+                    // layer.renderModels(true);
+                    // layer.hooks.afterPickingEncode.call();
 
-                      return (_pickedTileLayer$tile = pickedTileLayer.tileLayer) === null || _pickedTileLayer$tile === void 0 ? void 0 : _pickedTileLayer$tile.clearPick(target.type);
-                    }); // Tip: 如果当前 layer 是瓦片图层，则走瓦片图层独立的拾取逻辑
-
-
-                    if (layer.tileLayer && layer.tileLayer.pickLayers) {
-                      return layer.tileLayer.pickLayers(target);
-                    }
-
-                    layer.hooks.beforePickingEncode.call();
-
-                    if (layer.masks.length > 0) {
-                      // 若存在 mask，则在 pick 阶段的绘制也启用
-                      layer.masks.map(function (m) {
-                        m.hooks.beforeRenderData.call();
-                        m.hooks.beforeRender.call();
-                        m.render();
-                        m.hooks.afterRender.call();
-                      });
-                    }
-
-                    layer.renderModels(true);
-                    layer.hooks.afterPickingEncode.call();
-
                     var isPicked = _this4.pickFromPickingFBO(layer, target);
@@ -498,0 +482,0 @@

lib/services/layer/LayerService.js

@@ -12,2 +12,4 @@ "use strict";
 
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
@@ -102,9 +104,13 @@
     value: function add(layer) {
+      var _this2 = this;
+
+      this.layers.push(layer);
+
       if (this.sceneInited) {
-        layer.init();
+        layer.init().then(function () {
+          _this2.updateLayerRenderList();
+
+          _this2.renderLayers();
+        });
       }
-
-      this.layers.push(layer);
-      this.updateLayerRenderList();
-      this.emit('layerChange', this.layers);
     }
@@ -114,4 +120,8 @@ }, {
     value: function addMask(mask) {
+      var _this3 = this;
+
       if (this.sceneInited) {
-        mask.init();
+        mask.init().then(function () {
+          _this3.renderLayers();
+        });
       }
@@ -121,11 +131,55 @@ }
     key: "initLayers",
-    value: function initLayers() {
-      this.sceneInited = true;
-      this.layers.forEach(function (layer) {
-        if (!layer.inited) {
-          layer.init();
-        }
-      });
-      this.updateLayerRenderList();
-    }
+    value: function () {
+      var _initLayers = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
+        var _this4 = this;
+
+        return _regenerator.default.wrap(function _callee2$(_context2) {
+          while (1) {
+            switch (_context2.prev = _context2.next) {
+              case 0:
+                this.sceneInited = true;
+                this.layers.forEach( /*#__PURE__*/function () {
+                  var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(layer) {
+                    return _regenerator.default.wrap(function _callee$(_context) {
+                      while (1) {
+                        switch (_context.prev = _context.next) {
+                          case 0:
+                            if (layer.startInit) {
+                              _context.next = 4;
+                              break;
+                            }
+
+                            _context.next = 3;
+                            return layer.init();
+
+                          case 3:
+                            _this4.updateLayerRenderList();
+
+                          case 4:
+                          case "end":
+                            return _context.stop();
+                        }
+                      }
+                    }, _callee);
+                  }));
+
+                  return function (_x) {
+                    return _ref2.apply(this, arguments);
+                  };
+                }());
+
+              case 2:
+              case "end":
+                return _context2.stop();
+            }
+          }
+        }, _callee2, this);
+      }));
+
+      function initLayers() {
+        return _initLayers.apply(this, arguments);
+      }
+
+      return initLayers;
+    }()
   }, {
@@ -210,15 +264,15 @@ key: "getSceneInited",
     value: function () {
-      var _renderLayers = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
+      var _renderLayers = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4() {
         var _iterator, _step, layer;
 
-        return _regenerator.default.wrap(function _callee$(_context) {
+        return _regenerator.default.wrap(function _callee4$(_context4) {
           while (1) {
-            switch (_context.prev = _context.next) {
+            switch (_context4.prev = _context4.next) {
               case 0:
                 if (!(this.alreadyInRendering || !this.enableRender)) {
-                  _context.next = 2;
+                  _context4.next = 2;
                   break;
                 }
 
-                return _context.abrupt("return");
+                return _context4.abrupt("return");
 
@@ -229,3 +283,3 @@ case 2:
                 _iterator = _createForOfIteratorHelper(this.layerList);
-                _context.prev = 5;
+                _context4.prev = 5;
 
@@ -236,3 +290,3 @@ _iterator.s();
                 if ((_step = _iterator.n()).done) {
-                  _context.next = 21;
+                  _context4.next = 19;
                   break;
@@ -242,6 +296,6 @@ }
                 layer = _step.value;
-                layer.hooks.beforeRenderData.call();
-                layer.hooks.beforeRender.call();
 
-                if (layer.masks.length > 0) {
+                if (layer.masks.filter(function (m) {
+                  return m.inited;
+                }).length > 0) {
                   // 清除上一次的模版缓存
@@ -253,58 +307,70 @@ this.renderService.clear({
                   });
-                  layer.masks.map(function (m) {
-                    m.hooks.beforeRenderData.call();
-                    m.hooks.beforeRender.call();
-                    m.render();
-                    m.hooks.afterRender.call();
-                  });
+                  layer.masks.map( /*#__PURE__*/function () {
+                    var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(m) {
+                      return _regenerator.default.wrap(function _callee3$(_context3) {
+                        while (1) {
+                          switch (_context3.prev = _context3.next) {
+                            case 0:
+                              m.render();
+
+                            case 1:
+                            case "end":
+                              return _context3.stop();
+                          }
+                        }
+                      }, _callee3);
+                    }));
+
+                    return function (_x2) {
+                      return _ref3.apply(this, arguments);
+                    };
+                  }());
                 }
 
                 if (!layer.getLayerConfig().enableMultiPassRenderer) {
-                  _context.next = 17;
+                  _context4.next = 15;
                   break;
                 }
 
-                _context.next = 15;
+                _context4.next = 13;
                 return layer.renderMultiPass();
 
-              case 15:
-                _context.next = 18;
+              case 13:
+                _context4.next = 17;
                 break;
 
+              case 15:
+                _context4.next = 17;
+                return layer.render();
+
               case 17:
-                layer.render();
+                _context4.next = 7;
+                break;
 
-              case 18:
-                layer.hooks.afterRender.call();
-
               case 19:
-                _context.next = 7;
+                _context4.next = 24;
                 break;
 
               case 21:
-                _context.next = 26;
-                break;
+                _context4.prev = 21;
+                _context4.t0 = _context4["catch"](5);
 
-              case 23:
-                _context.prev = 23;
-                _context.t0 = _context["catch"](5);
+                _iterator.e(_context4.t0);
 
-                _iterator.e(_context.t0);
+              case 24:
+                _context4.prev = 24;
 
-              case 26:
-                _context.prev = 26;
-
                 _iterator.f();
 
-                return _context.finish(26);
+                return _context4.finish(24);
 
-              case 29:
+              case 27:
                 this.alreadyInRendering = false;
 
-              case 30:
+              case 28:
               case "end":
-                return _context.stop();
+                return _context4.stop();
             }
           }
-        }, _callee, this, [[5, 23, 26, 29]]);
+        }, _callee4, this, [[5, 21, 24, 27]]);
       }));
@@ -319,5 +385,98 @@
   }, {
+    key: "renderMask",
+    value: function renderMask(masks) {
+      masks.filter(function (m) {
+        return m.inited;
+      }).map(function (m) {
+        m.render();
+      });
+    }
+  }, {
+    key: "beforeRenderData",
+    value: function () {
+      var _beforeRenderData = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee5(layer) {
+        var res;
+        return _regenerator.default.wrap(function _callee5$(_context5) {
+          while (1) {
+            switch (_context5.prev = _context5.next) {
+              case 0:
+                _context5.next = 2;
+                return layer.hooks.beforeRenderData.promise();
+
+              case 2:
+                res = _context5.sent;
+                res && this.renderLayers();
+
+              case 4:
+              case "end":
+                return _context5.stop();
+            }
+          }
+        }, _callee5, this);
+      }));
+
+      function beforeRenderData(_x3) {
+        return _beforeRenderData.apply(this, arguments);
+      }
+
+      return beforeRenderData;
+    }()
+  }, {
+    key: "renderLayer",
+    value: function () {
+      var _renderLayer = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee6(layer) {
+        var _this5 = this;
+
+        return _regenerator.default.wrap(function _callee6$(_context6) {
+          while (1) {
+            switch (_context6.prev = _context6.next) {
+              case 0:
+                if (layer.masks.filter(function (m) {
+                  return m.inited;
+                }).length > 0) {
+                  layer.masks.map(function (mask) {
+                    _this5.renderService.clear({
+                      stencil: 0,
+                      depth: 1,
+                      framebuffer: null
+                    });
+
+                    mask.render();
+                  });
+                }
+
+                if (!layer.getLayerConfig().enableMultiPassRenderer) {
+                  _context6.next = 6;
+                  break;
+                }
+
+                _context6.next = 4;
+                return layer.renderMultiPass();
+
+              case 4:
+                _context6.next = 8;
+                break;
+
+              case 6:
+                _context6.next = 8;
+                return layer.render();
+
+              case 8:
+              case "end":
+                return _context6.stop();
+            }
+          }
+        }, _callee6);
+      }));
+
+      function renderLayer(_x4) {
+        return _renderLayer.apply(this, arguments);
+      }
+
+      return renderLayer;
+    }()
+  }, {
     key: "updateLayerRenderList",
     value: function updateLayerRenderList() {
-      var _this2 = this;
+      var _this6 = this;
 
@@ -334,3 +493,3 @@ // Tip: 每次更新都是从 layers 重新构建
       }).forEach(function (layer) {
-        _this2.layerList.push(layer);
+        _this6.layerList.push(layer);
       });
@@ -385,4 +544,66 @@ }
       return this.shaderPicking;
+    } // For Pick
+    // 拾取绘制
+
+  }, {
+    key: "pickRender",
+    value: function pickRender(layer, target) {
+      if (layer.tileLayer) {
+        // 瓦片图层（layerGroup）走独立的拾取渲染
+        return layer.tileLayer.pickRender(target);
+      } // 普通瓦片（单个图层的拾取渲染）
+
+
+      layer.hooks.beforePickingEncode.call();
+
+      if (layer.masks.length > 0) {
+        // 若存在 mask，则在 pick 阶段的绘制也启用
+        layer.masks.map( /*#__PURE__*/function () {
+          var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee7(m) {
+            return _regenerator.default.wrap(function _callee7$(_context7) {
+              while (1) {
+                switch (_context7.prev = _context7.next) {
+                  case 0:
+                    m.render();
+
+                  case 1:
+                  case "end":
+                    return _context7.stop();
+                }
+              }
+            }, _callee7);
+          }));
+
+          return function (_x5) {
+            return _ref4.apply(this, arguments);
+          };
+        }());
+      }
+
+      layer.renderModels(true);
+      layer.hooks.afterPickingEncode.call();
     }
   }, {
+    key: "selectFeature",
+    value: function selectFeature(layer, pickedColors) {
+      if (layer.tileLayer) {
+        return layer.tileLayer.selectFeature(pickedColors);
+      } // @ts-ignore
+
+
+      var _pickedColors = (0, _slicedToArray2.default)(pickedColors, 3),
+          r = _pickedColors[0],
+          g = _pickedColors[1],
+          b = _pickedColors[2];
+
+      layer.hooks.beforeSelect.call([r, g, b]);
+    }
+  }, {
+    key: "highlightPickedFeature",
+    value: function highlightPickedFeature(layer, pickedColors) {
+      if (layer.tileLayer) {
+        return layer.tileLayer.highlightPickedFeature(pickedColors);
+      }
+    }
+  }, {
     key: "clear",
@@ -389,0 +610,0 @@ value: function clear() {

lib/services/scene/SceneService.js

@@ -266,7 +266,3 @@ "use strict";
         }, _callee2);
-      }))); // TODO：init worker, fontAtlas...
-      // 执行异步并行初始化任务
-      // @ts-ignore
-
-      this.initPromise = this.hooks.init.promise();
+      })));
       this.render();
@@ -415,3 +411,3 @@ }
                 if (this.inited) {
-                  _context5.next = 12;
+                  _context5.next = 16;
                   break;
@@ -421,3 +417,3 @@ }
                 _context5.next = 6;
-                return this.initPromise;
+                return this.hooks.init.promise();
 
@@ -431,3 +427,7 @@ case 6:
 
-                this.layerService.initLayers();
+                _context5.next = 9;
+                return this.layerService.initLayers();
+
+              case 9:
+                this.layerService.renderLayers();
                 this.controlService.addControls();
@@ -437,11 +437,15 @@ this.loaded = true;
                 this.inited = true;
+                _context5.next = 18;
+                break;
 
-              case 12:
+              case 16:
                 // 尝试初始化未初始化的图层
-                this.layerService.updateLayerRenderList();
-                this.layerService.renderLayers(); // 组件需要等待layer 初始化完成之后添加
+                this.layerService.initLayers();
+                this.layerService.renderLayers();
 
+              case 18:
+                // 组件需要等待layer 初始化完成之后添加
                 this.rendering = false;
 
-              case 15:
+              case 19:
               case "end":
@@ -448,0 +452,0 @@ return _context5.stop();

lib/services/source/ISourceService.js

@@ -5,2 +5,12 @@ "use strict";
   value: true
-});
+});
+exports.RasterTileType = void 0;
+// 栅格瓦片解析配置项
+var RasterTileType;
+exports.RasterTileType = RasterTileType;
+
+(function (RasterTileType) {
+  RasterTileType["IMAGE"] = "image";
+  RasterTileType["ARRAYBUFFER"] = "arraybuffer";
+  RasterTileType["RGB"] = "rgb";
+})(RasterTileType || (exports.RasterTileType = RasterTileType = {}));

package.json

 {
   "name": "@antv/l7-core",
-  "version": "2.10.1",
+  "version": "2.10.2",
   "description": "",
@@ -27,4 +27,4 @@ "main": "lib/index.js",
   "dependencies": {
-    "@antv/async-hook": "^2.2.2",
-    "@antv/l7-utils": "2.10.1",
+    "@antv/async-hook": "^2.2.9",
+    "@antv/l7-utils": "2.10.2",
     "@babel/runtime": "^7.7.7",
@@ -38,3 +38,3 @@ "@turf/helpers": "^6.1.4",
     "inversify-inject-decorators": "^3.1.0",
-    "l7-tiny-sdf": "^0.0.3",
+    "l7-tiny-sdf": "^0.0.4",
     "l7hammerjs": "^0.0.7",
@@ -53,3 +53,3 @@ "lodash": "^4.17.15",
   },
-  "gitHead": "25282411015887cd36c2de1e89a43beb886e1a70",
+  "gitHead": "2182dc4ba3ea9e59e964ea853eff2733e5861357",
   "publishConfig": {
@@ -56,0 +56,0 @@ "access": "public"

No alert changes

Improved metrics

Total package byte prevSize

973572

increased by1.95%

Lines of code

19641

increased by2.79%

Dependency changes

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

• + Addedl7-tiny-sdf@0.0.4(transitive)

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

• - Removedl7-tiny-sdf@0.0.3(transitive)

• Updated@antv/async-hook@^2.2.9

• Updated@antv/l7-utils@2.10.2

• Updatedl7-tiny-sdf@^0.0.4