@antv/l7-layers 2.9.27-alpha.2 → 2.9.27-alpha.3

package/es/tile/tileFactory/base.js

@@ -10,7 +10,14 @@ import { getLayerShape, readRasterValue, registerLayers } from "../utils";
 import VectorLayer from "./vectorLayer";
 import * as turf from '@turf/helpers';
 import union from '@turf/union';
+import clone from '@turf/clone';
 import polygonToLineString from '@turf/polygon-to-line';
+var EMPTY_FEATURE_DATA = {
+  features: [],
+  featureId: null,
+  vectorTileLayer: null,
+  source: null
+};
 
 var TileFactory = /*#__PURE__*/function () {
   // 用于记录图层内事件，辅助判断图层外事件逻辑
@@ -33,7 +40,8 @@ var TileFactory = /*#__PURE__*/function () {
     var source = this.parentLayer.getSource();
     this.zoomOffset = source.parser.zoomOffset || 0;
     this.tilesetManager = source.tileset;
-  }
+  } // eslint-disable-next-line @typescript-eslint/no-unused-vars
+
 
   _createClass(TileFactory, [{
     key: "createTile",
@@ -46,44 +54,41 @@ var TileFactory = /*#__PURE__*/function () {
   }, {
     key: "getFeatureData",
     value: function getFeatureData(tile, initOptions) {
-      var emptyData = {
-        features: [],
-        featureId: null,
-        vectorTileLayer: null,
-        source: null
-      };
       var sourceLayer = initOptions.sourceLayer,
           featureId = initOptions.featureId,
-          transforms = initOptions.transforms,
+          _initOptions$transfor = initOptions.transforms,
+          transforms = _initOptions$transfor === void 0 ? [] : _initOptions$transfor,
           layerType = initOptions.layerType,
           shape = initOptions.shape;
 
       if (!sourceLayer) {
-        return emptyData;
+        return EMPTY_FEATURE_DATA;
       }
 
       var vectorTileLayer = tile.data.layers[sourceLayer];
       var features = vectorTileLayer === null || vectorTileLayer === void 0 ? void 0 : vectorTileLayer.features;
 
       if (!(Array.isArray(features) && features.length > 0)) {
-        return emptyData;
+        return EMPTY_FEATURE_DATA;
       } else {
         var geofeatures = [];
 
         if (layerType === 'LineLayer' && shape === 'simple') {
           features.map(function (feature) {
-            if (feature.geometry.type === 'MultiPolygon') {
+            var cloneFeature = clone(feature);
+
+            if (cloneFeature.geometry.type === 'MultiPolygon') {
               var _geofeatures;
 
               // @ts-ignore
-              var linefeatures = polygonToLineString(feature).features;
+              var linefeatures = polygonToLineString(cloneFeature).features;
 
               (_geofeatures = geofeatures).push.apply(_geofeatures, _toConsumableArray(linefeatures));
-            } else if (feature.geometry.type === 'Polygon') {
-              feature.geometry.type = 'MultiLineString';
-              geofeatures.push(feature);
+            } else if (cloneFeature.geometry.type === 'Polygon') {
+              cloneFeature.geometry.type = 'MultiLineString';
+              geofeatures.push(cloneFeature);
             } else {
-              geofeatures.push(feature);
+              geofeatures.push(cloneFeature);
             }
           });
         } else {
@@ -96,7 +101,8 @@ var TileFactory = /*#__PURE__*/function () {
         }, {
           parser: {
             type: 'geojson',
-            featureId: featureId
+            featureId: featureId,
+            cancelExtent: true
           },
           transforms: transforms
         });
@@ -120,28 +126,43 @@ var TileFactory = /*#__PURE__*/function () {
           color = initOptions.color,
           layerType = initOptions.layerType,
           size = initOptions.size,
-          shape = initOptions.shape;
+          shape = initOptions.shape,
+          usage = initOptions.usage,
+          basemapColor = initOptions.basemapColor,
+          basemapSize = initOptions.basemapSize;
       var FactoryTileLayer = L7Layer ? L7Layer : VectorLayer;
       var layer = new FactoryTileLayer(_objectSpread({
         visible: tile.isVisible,
         tileOrigin: vectorTileLayer === null || vectorTileLayer === void 0 ? void 0 : vectorTileLayer.l7TileOrigin,
         coord: vectorTileLayer === null || vectorTileLayer === void 0 ? void 0 : vectorTileLayer.l7TileCoord
-      }, this.getLayerInitOption(initOptions))); // vector layer set config
+      }, this.getLayerInitOption(initOptions)));
+      if (layerType) layer.type = layerType; // Tip: sign tile layer
 
-      if (layer.isVector) {
+      layer.isTileLayer = true; // vector 、raster
+      // vector layer set event
+
+      if (layer.isVector && usage !== 'basemap') {
         this.emitEvent([layer]);
-        layer.type = layerType;
         layer.select(true);
       } // set source
 
 
-      layer.source(source); // set scale
-
-      this.setScale(layer); // set scale attribute field
+      layer.source(source); // set scale attribute field
 
       this.setStyleAttributeField(layer, 'shape', shape);
-      this.setStyleAttributeField(layer, 'color', color);
-      this.setStyleAttributeField(layer, 'size', size); // set mask
+
+      if (usage !== 'basemap') {
+        // set scale
+        this.setScale(layer);
+        this.setStyleAttributeField(layer, 'color', color);
+        this.setStyleAttributeField(layer, 'size', size);
+      } else {
+        layer.style({
+          color: basemapColor,
+          size: basemapSize
+        });
+      } // set mask
+
 
       var layers = [layer];
 
@@ -149,7 +170,12 @@ var TileFactory = /*#__PURE__*/function () {
         var masklayer = new MaskLayer().source({
           type: 'FeatureCollection',
           features: [tile.bboxPolygon]
-        }).shape('fill');
+        }, {
+          parser: {
+            type: 'geojson',
+            cancelExtent: true
+          }
+        });
         layers.push(masklayer);
         layer.addMaskLayer(masklayer);
       } // regist layer
@@ -169,7 +195,7 @@ var TileFactory = /*#__PURE__*/function () {
     value: function getDefautStyleAttributeField(layer, type) {
       switch (type) {
         case 'size':
-          return 2;
+          return 1;
 
         case 'color':
           return '#fff';
@@ -248,8 +274,7 @@ var TileFactory = /*#__PURE__*/function () {
       var tiles = this.tilesetManager.tiles.filter(function (t) {
         return t.key === "".concat(xy[0], ",").concat(xy[1], ",").concat(z);
       });
-      var tile = tiles[0];
-      return tile;
+      return tiles[0];
     }
   }, {
     key: "emitEvent",
@@ -268,7 +293,7 @@ var TileFactory = /*#__PURE__*/function () {
 
               var tile = _this.getTile(lng, lat);
 
-              _this.getFeatureAndEmitEvent(layer, 'subLayerClick', e, isVector, tile);
+              tile && _this.getFeatureAndEmitEvent(layer, 'subLayerClick', e, isVector, tile);
             } else {
               _this.getFeatureAndEmitEvent(layer, 'subLayerClick', e);
             }
@@ -283,7 +308,7 @@ var TileFactory = /*#__PURE__*/function () {
 
               var tile = _this.getTile(lng, lat);
 
-              _this.getFeatureAndEmitEvent(layer, 'subLayerMouseMove', e, isVector, tile);
+              tile && _this.getFeatureAndEmitEvent(layer, 'subLayerMouseMove', e, isVector, tile);
             } else {
               _this.getFeatureAndEmitEvent(layer, 'subLayerMouseMove', e);
             }
@@ -301,7 +326,7 @@ var TileFactory = /*#__PURE__*/function () {
 
               var tile = _this.getTile(lng, lat);
 
-              _this.getFeatureAndEmitEvent(layer, 'subLayerMouseMove', e, isVector, tile);
+              tile && _this.getFeatureAndEmitEvent(layer, 'subLayerMouseMove', e, isVector, tile);
             } else {
               _this.getFeatureAndEmitEvent(layer, 'subLayerMouseEnter', e);
             }

package/es/tile/tileFactory/line.js

@@ -46,6 +46,9 @@ var VectorPolygonTile = /*#__PURE__*/function (_TileFactory) {
         vectorTileLayer: vectorTileLayer,
         source: source
       });
+      layer.once('modelLoaded', function () {
+        tile.layerLoad();
+      });
       return {
         layers: [layer],
         layerIDList: [layer.id]

package/es/tile/tileFactory/point.js

@@ -46,6 +46,9 @@ var VectorPolygonTile = /*#__PURE__*/function (_TileFactory) {
         vectorTileLayer: vectorTileLayer,
         source: source
       });
+      layer.once('modelLoaded', function () {
+        tile.layerLoad();
+      });
       return {
         layers: [layer],
         layerIDList: [layer.id]

package/es/tile/tileFactory/polygon.js

@@ -46,6 +46,9 @@ var VectorPolygonTile = /*#__PURE__*/function (_TileFactory) {
         vectorTileLayer: vectorTileLayer,
         source: source
       });
+      layer.once('modelLoaded', function () {
+        tile.layerLoad();
+      });
       return {
         layers: [layer],
         layerIDList: [layer.id]

package/es/tile/tileFactory/raster.js

@@ -42,6 +42,9 @@ var RasterTile = /*#__PURE__*/function (_TileFactory) {
         initOptions: initOptions,
         source: source
       });
+      layer.once('modelLoaded', function () {
+        tile.layerLoad();
+      });
       return {
         layers: [layer],
         layerIDList: [layer.id]

package/es/tile/tileFactory/rasterData.js

@@ -67,6 +67,9 @@ var RasterTiffTile = /*#__PURE__*/function (_TileFactory) {
       });
       this.emitEvent([layer], false);
       registerLayers(this.parentLayer, [layer]);
+      layer.once('modelLoaded', function () {
+        tile.layerLoad();
+      });
       return {
         layers: [layer],
         layerIDList: [layer.id]

package/es/tile/tileFactory/rasterDataLayer.js

@@ -44,7 +44,9 @@ var RasterTiffLayer = /*#__PURE__*/function (_BaseLayer) {
       this.layerModel.initModels(function (models) {
         _this2.models = models;
 
-        _this2.renderLayers();
+        _this2.emit('modelLoaded', null);
+
+        _this2.layerService.throttleRenderLayers();
       });
     }
   }, {
@@ -53,7 +55,9 @@ var RasterTiffLayer = /*#__PURE__*/function (_BaseLayer) {
       var _this3 = this;
 
       this.layerModel.buildModels(function (models) {
-        return _this3.models = models;
+        _this3.models = models;
+
+        _this3.emit('modelLoaded', null);
       });
     }
   }, {

package/es/tile/tileFactory/test.js

@@ -51,24 +51,45 @@ var TestTile = /*#__PURE__*/function (_TileFactory) {
 
       var properties = features[0].properties;
       var text = new VectorLayer({
-        layerType: 'PointLayer'
+        layerType: 'PointLayer',
+        usage: 'basemap'
       }).source([properties], {
         parser: {
           type: 'json',
           x: 'textLng',
-          y: 'textLat'
+          y: 'textLat',
+          cancelExtent: true
         }
-      }).shape('key', 'text').size(20).color('#000').style({
+      }).shape('key', 'text').style({
+        size: 20,
+        color: '#000',
         stroke: '#fff',
         strokeWidth: 2
       });
       var line = new VectorLayer({
-        layerType: 'LineLayer'
+        layerType: 'LineLayer',
+        usage: 'basemap'
       }).source({
         type: 'FeatureCollection',
         features: features
-      }).shape('simple').color('#000');
+      }, {
+        parser: {
+          type: 'geojson',
+          cancelExtent: true
+        }
+      }).shape('simple').style({
+        color: '#000'
+      }); // Tip: sign tile layer
+
+      text.isTileLayer = true;
+      line.isTileLayer = true;
       registerLayers(this.parentLayer, [line, text]);
+      text.once('modelLoaded', function () {
+        tile.layerLoad();
+      });
+      line.once('modelLoaded', function () {
+        tile.layerLoad();
+      });
       return {
         layers: [line, text],
         layerIDList: [line.id, text.id]

package/es/tile/tileFactory/vectorLayer.d.ts

@@ -1,7 +1,7 @@
 import BaseLayer from '../../core/BaseLayer';
 import { ILineLayerStyleOptions, IPointLayerStyleOptions, IPolygonLayerStyleOptions } from '../../core/interface';
 import lineFillModel from '../../line/models/tile';
-import lineSimpleModel from '../../line/models/simpleLine';
+import lineSimpleModel from '../../line/models/simpleTileLine';
 import pointTextModel from '../../point/models/tileText';
 import pointFillModel from '../../point/models/tile';
 import polygonFillModel from '../../polygon/models/tile';
@@ -9,6 +9,9 @@ export default class VectorLayer extends BaseLayer<Partial<IPolygonLayerStyleOpt
     isVector: boolean;
     type: string;
     private pickedID;
+    init(): this;
+    renderModels(isPicking?: boolean): this;
+    protected sourceEvent: () => void;
     getPickID(): number | null;
     setPickID(): number | null;
     buildModels(): void;

package/es/tile/tileFactory/vectorLayer.js

@@ -1,3 +1,4 @@
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
@@ -6,13 +7,20 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstruct
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 
+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; } } }; }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+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 _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; } }
 
+import { TYPES } from '@antv/l7-core';
 import BaseLayer from "../../core/BaseLayer";
 import lineFillModel from "../../line/models/tile";
-import lineSimpleModel from "../../line/models/simpleLine";
+import lineSimpleModel from "../../line/models/simpleTileLine";
 import pointTextModel from "../../point/models/tileText";
 import pointFillModel from "../../point/models/tile";
 import polygonFillModel from "../../polygon/models/tile";
@@ -35,14 +43,105 @@ var VectorLayer = /*#__PURE__*/function (_BaseLayer) {
 
     _defineProperty(_assertThisInitialized(_this), "isVector", true);
 
-    _defineProperty(_assertThisInitialized(_this), "type", _this.layerType);
+    _defineProperty(_assertThisInitialized(_this), "type", _this.layerType || 'vectorLayer');
 
     _defineProperty(_assertThisInitialized(_this), "pickedID", null);
 
+    _defineProperty(_assertThisInitialized(_this), "sourceEvent", function () {
+      // Tip: vector 不支持 autoFit
+      _this.dataState.dataSourceNeedUpdate = true;
+
+      _this.reRender();
+    });
+
     return _this;
   }
 
   _createClass(VectorLayer, [{
+    key: "init",
+    value: function init() {
+      var _this2 = this;
+
+      // 设置配置项
+      var sceneId = this.container.get(TYPES.SceneID);
+      this.configService.setLayerConfig(sceneId, this.id, this.rawConfig);
+      this.layerType = this.rawConfig.layerType;
+
+      if (this.type === 'PointLayer') {
+        // Tip: iconService 和 fontService 只有在矢量点图层中才会被使用
+        this.iconService = this.container.get(TYPES.IIconService);
+        this.fontService = this.container.get(TYPES.IFontService);
+      }
+
+      this.rendererService = this.container.get(TYPES.IRendererService);
+      this.layerService = this.container.get(TYPES.ILayerService);
+      this.mapService = this.container.get(TYPES.IMapService);
+      this.cameraService = this.container.get(TYPES.ICameraService);
+      this.coordinateService = this.container.get(TYPES.ICoordinateSystemService);
+      this.shaderModuleService = this.container.get(TYPES.IShaderModuleService);
+      this.postProcessingPassFactory = this.container.get(TYPES.IFactoryPostProcessingPass);
+      this.normalPassFactory = this.container.get(TYPES.IFactoryNormalPass); // 图层容器服务
+
+      this.styleAttributeService = this.container.get(TYPES.IStyleAttributeService); // 完成样式服务注册完成前添加的属性
+
+      this.pendingStyleAttributes.forEach(function (_ref) {
+        var attributeName = _ref.attributeName,
+            attributeField = _ref.attributeField,
+            attributeValues = _ref.attributeValues,
+            updateOptions = _ref.updateOptions;
+
+        _this2.styleAttributeService.updateStyleAttribute(attributeName, {
+          // @ts-ignore
+          scale: _objectSpread({
+            field: attributeField
+          }, _this2.splitValuesAndCallbackInAttribute( // @ts-ignore
+          attributeValues, // @ts-ignore
+          _this2.getLayerConfig()[attributeName]))
+        }, // @ts-ignore
+        updateOptions);
+      });
+      this.pendingStyleAttributes = []; // 获取插件集
+
+      this.plugins = this.container.getAll(TYPES.ILayerPlugin); // 完成插件注册，传入场景和图层容器内的服务
+
+      var _iterator = _createForOfIteratorHelper(this.plugins),
+          _step;
+
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var plugin = _step.value;
+          plugin.apply(this, {
+            rendererService: this.rendererService,
+            mapService: this.mapService,
+            styleAttributeService: this.styleAttributeService,
+            normalPassFactory: this.normalPassFactory,
+            postProcessingPassFactory: this.postProcessingPassFactory
+          });
+        } // 触发 init 生命周期插件
+
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+
+      this.hooks.init.call();
+      this.hooks.afterInit.call();
+      return this;
+    }
+  }, {
+    key: "renderModels",
+    value: function renderModels(isPicking) {
+      var _this3 = this;
+
+      this.models.forEach(function (model) {
+        model.draw({
+          uniforms: _this3.layerModel.getUninforms()
+        }, isPicking);
+      });
+      return this;
+    }
+  }, {
     key: "getPickID",
     value: function getPickID() {
       return this.pickedID;
@@ -55,23 +154,27 @@ var VectorLayer = /*#__PURE__*/function (_BaseLayer) {
   }, {
     key: "buildModels",
     value: function buildModels() {
-      var _this2 = this;
+      var _this4 = this;
 
       var model = this.getModelType();
       this.layerModel = new model(this);
       this.layerModel.initModels(function (models) {
-        _this2.models = models;
+        _this4.models = models;
 
-        _this2.renderLayers();
+        _this4.emit('modelLoaded', null);
+
+        _this4.layerService.throttleRenderLayers();
       });
     }
   }, {
     key: "rebuildModels",
     value: function rebuildModels() {
-      var _this3 = this;
+      var _this5 = this;
 
       this.layerModel.buildModels(function (models) {
-        return _this3.models = models;
+        _this5.models = models;
+
+        _this5.emit('modelLoaded', null);
       });
     }
   }, {

package/es/tile/tileLayer/baseMapTileLayer.d.ts

@@ -0,0 +1,29 @@
+import { ILayer, ILayerService, IMapService, IBaseTileLayer, IBaseTileLayerManager, ITileLayerOPtions } from '@antv/l7-core';
+import { Tile, TilesetManager } from '@antv/l7-utils';
+export default class BaseTileLayer implements IBaseTileLayer {
+    get children(): ILayer[];
+    type: string;
+    sourceLayer: string;
+    parent: ILayer;
+    initedTileset: boolean;
+    tilesetManager: TilesetManager | undefined;
+    tileLayerManager: IBaseTileLayerManager;
+    scaleField: any;
+    private lastViewStates;
+    protected mapService: IMapService;
+    protected layerService: ILayerService;
+    constructor({ parent, rendererService, mapService, layerService, }: ITileLayerOPtions);
+    /**
+     * 渲染瓦片的图层
+     */
+    render(): void;
+    tileLoaded(tile: Tile): void;
+    tileError(error: Error): void;
+    tileUnLoad(tile: Tile): void;
+    tileUpdate(): void;
+    private initTileSetManager;
+    private mapchange;
+    private bindTilesetEvent;
+    viewchange: import("lodash").DebouncedFunc<() => void>;
+    private getCurrentView;
+}