From 6754bf52d2017d3849e4e7f4a5ad003ed3e94cd8 Mon Sep 17 00:00:00 2001 From: YiQianYao <42212176+yiiiiiiqianyao@users.noreply.github.com> Date: Fri, 14 Oct 2022 15:47:45 +0800 Subject: [PATCH] =?UTF-8?q?fix:=E4=BF=AE=E5=A4=8D=E4=BA=8B=E4=BB=B6?= =?UTF-8?q?=E5=90=8D=E4=B8=A2=E5=A4=B1=20(#1393)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * chore: rename sourceUpdate -> update * chore: remove useless code * feat: 修改初始化 mask 的 逻辑 Co-authored-by: shihui --- .../features/line/demos/greatcircleline.tsx | 2 +- dev-demos/features/line/demos/line.tsx | 2 +- dev-demos/features/line/demos/linearc.tsx | 2 +- dev-demos/features/mask/demos/heatmap.tsx | 84 +++++++++++++++++-- dev-demos/features/polygon/demos/fill.tsx | 34 ++++++++ dev-docs/ConfigSchemaValidation.md | 17 ---- ...oC 容器、依赖注入与服务说明.md | 21 ----- packages/layers/src/Geometry/index.ts | 11 --- .../layers/src/Geometry/models/billboard.ts | 12 --- packages/layers/src/Geometry/models/plane.ts | 12 --- packages/layers/src/Geometry/models/sprite.ts | 12 --- packages/layers/src/canvas/index.ts | 11 --- packages/layers/src/citybuliding/building.ts | 11 --- packages/layers/src/core/BaseLayer.ts | 18 ++-- packages/layers/src/heatmap/index.ts | 12 --- packages/layers/src/image/index.ts | 12 +-- packages/layers/src/image/models/dataImage.ts | 12 --- packages/layers/src/image/models/image.ts | 12 --- .../layers/src/image/models/tileDataImage.ts | 12 --- packages/layers/src/line/index.ts | 11 --- packages/layers/src/mask/index.ts | 11 --- .../layers/src/plugins/DataMappingPlugin.ts | 4 +- .../layers/src/plugins/DataSourcePlugin.ts | 2 +- .../layers/src/plugins/FeatureScalePlugin.ts | 2 +- .../layers/src/plugins/LayerModelPlugin.ts | 2 +- packages/layers/src/point/index.ts | 12 +-- packages/layers/src/polygon/index.ts | 11 --- packages/layers/src/raster/index.ts | 12 +-- packages/layers/src/raster/raster.ts | 11 --- .../tileFactory/layers/rasterDataLayer.ts | 11 --- .../tile/tileFactory/layers/vectorLayer.ts | 12 --- packages/layers/src/wind/index.ts | 12 +-- packages/layers/src/wind/models/wind.ts | 12 --- packages/scene/src/index.ts | 49 ++++++----- packages/source/src/source.ts | 3 +- packages/utils/src/lineAtOffset/index.ts | 2 +- stories/layerbuild/components/SourceTest.tsx | 8 +- 37 files changed, 162 insertions(+), 334 deletions(-) diff --git a/dev-demos/features/line/demos/greatcircleline.tsx b/dev-demos/features/line/demos/greatcircleline.tsx index cd17d3aaef..9743ffa665 100644 --- a/dev-demos/features/line/demos/greatcircleline.tsx +++ b/dev-demos/features/line/demos/greatcircleline.tsx @@ -76,7 +76,7 @@ export default () => { // thetaOffset: 0.5, }); - source.on('sourceUpdate', () => { + source.on('update', () => { // console.log(scene.getMapService().version) // const midPoints = lineAtOffset(source, 0.3, 'arc', 'offset'); const midPoints = lineAtOffset(source, { diff --git a/dev-demos/features/line/demos/line.tsx b/dev-demos/features/line/demos/line.tsx index fd5f6322b2..63a6242956 100644 --- a/dev-demos/features/line/demos/line.tsx +++ b/dev-demos/features/line/demos/line.tsx @@ -78,7 +78,7 @@ export default () => { .color('#f00') .style({}); - source.on('sourceUpdate', () => { + source.on('update', () => { console.log(source); const midPoints = lineAtOffset(source, { offset: 0.1, diff --git a/dev-demos/features/line/demos/linearc.tsx b/dev-demos/features/line/demos/linearc.tsx index a9b4d487f3..4c2770e696 100644 --- a/dev-demos/features/line/demos/linearc.tsx +++ b/dev-demos/features/line/demos/linearc.tsx @@ -77,7 +77,7 @@ export default () => { thetaOffset: 0.5, }); - source.on('sourceUpdate', () => { + source.on('update', () => { const midPoints = lineAtOffset(source, { offset: 0.1, shape: 'arc', diff --git a/dev-demos/features/mask/demos/heatmap.tsx b/dev-demos/features/mask/demos/heatmap.tsx index 54476ecf41..8e78db0168 100644 --- a/dev-demos/features/mask/demos/heatmap.tsx +++ b/dev-demos/features/mask/demos/heatmap.tsx @@ -1,5 +1,5 @@ // @ts-ignore -import { Scene, HeatmapLayer } from '@antv/l7'; +import { Scene, HeatmapLayer, PointLayer } from '@antv/l7'; // @ts-ignore import { GaodeMap } from '@antv/l7-maps'; import React, { useEffect } from 'react'; @@ -49,18 +49,81 @@ export default () => { ], }; + + const point = new PointLayer({ + // mask: true, + // maskInside: false, + // maskfence: maskData, + // maskColor: '#fff', + // maskOpacity: 0.5, + }).source([{ + lng:120, lat:30 + }], { + parser: { + type: 'json', + x: 'lng', + y: 'lat' + } + }) + .shape('circle') + .size(20) + .color('#f00'); + scene.addLayer(point) + scene.on('loaded', () => { + // const point = new PointLayer({ + // mask: true, + // maskInside: false, + // maskfence: maskData, + // maskColor: '#fff', + // maskOpacity: 0.5, + // }).source([{ + // lng:120, lat:30 + // }], { + // parser: { + // type: 'json', + // x: 'lng', + // y: 'lat' + // } + // }) + // .shape('circle') + // .size(20) + // .color('#f00'); + // scene.addLayer(point) + // point.on('update', ( ) =>point.renderLayers()) fetch( 'https://gw.alipayobjects.com/os/basement_prod/d3564b06-670f-46ea-8edb-842f7010a7c6.json', ) .then((res) => res.json()) .then((data) => { + + + // const point = new PointLayer({ + // // mask: true, + // // maskInside: false, + // // maskfence: maskData, + // // maskColor: '#fff', + // // maskOpacity: 0.5, + // }).source([{ + // lng:130, lat:30 + // }], { + // parser: { + // type: 'json', + // x: 'lng', + // y: 'lat' + // } + // }) + // .shape('circle') + // .size(20) + // .color('#f00'); + // scene.addLayer(point) + const heatmapLayer = new HeatmapLayer({ - mask: true, - maskInside: false, - maskfence: maskData, - maskColor: '#fff', - maskOpacity: 0.5, + // mask: true, + // maskInside: false, + // maskfence: maskData, + // maskColor: '#fff', + // maskOpacity: 0.5, }) .source(data) .shape('heatmap3D') // heatmap3D heatmap @@ -81,7 +144,14 @@ export default () => { positions: [0, 0.2, 0.4, 0.6, 0.8, 1.0], }, }); - scene.addLayer(heatmapLayer); + scene.addLayer(heatmapLayer); + + // scene.render() + // setTimeout(() =>{ + // scene.render(); + // }, 1000) + // console.log('rrr') + }); }); }, []); diff --git a/dev-demos/features/polygon/demos/fill.tsx b/dev-demos/features/polygon/demos/fill.tsx index 91fa31a102..9c065483f4 100644 --- a/dev-demos/features/polygon/demos/fill.tsx +++ b/dev-demos/features/polygon/demos/fill.tsx @@ -42,6 +42,30 @@ export default () => { ], }; + const data2 = { + type: 'FeatureCollection', + features: [ + { + type: 'Feature', + properties: { + testOpacity: 0.8, + }, + geometry: { + type: 'Polygon', + coordinates: [ + [ + [113.8623046875, 30.031055426540206], + [115.3232421875, 30.031055426540206], + [115.3232421875, 31.090574094954192], + [113.8623046875, 31.090574094954192], + [113.8623046875, 30.031055426540206], + ], + ], + }, + }, + ], + }; + const layer = new PolygonLayer({}) .source(data) @@ -53,6 +77,16 @@ export default () => { scene.on('loaded', () => { scene.addLayer(layer); + + setTimeout(() =>{ + layer.setData(data2) + }, 200) + layer.on('mousemove', () =>{ + console.log('mousemove') + }) + layer.on('unmousemove', () =>{ + console.log('unmousemove') + }) }); }, []); return ( diff --git a/dev-docs/ConfigSchemaValidation.md b/dev-docs/ConfigSchemaValidation.md index 0b17d579b3..572320e11c 100644 --- a/dev-docs/ConfigSchemaValidation.md +++ b/dev-docs/ConfigSchemaValidation.md @@ -79,20 +79,3 @@ export default { 如果传入了错误的配置项则会在控制台给出提示。 -## Layer 子类配置项 Schema - -Layer 子类可以通过重载 `getConfigSchema()` 方法定义自身的特有属性。例如 `PolygonLayer` 需要定义透明度： - -```javascript -protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; -} -``` diff --git a/dev-docs/IoC 容器、依赖注入与服务说明.md b/dev-docs/IoC 容器、依赖注入与服务说明.md index d7c9432817..11fe1857ff 100644 --- a/dev-docs/IoC 容器、依赖注入与服务说明.md +++ b/dev-docs/IoC 容器、依赖注入与服务说明.md @@ -106,27 +106,6 @@ protected setupShaders() { } ``` -### 配置项校验服务 - -开发者不需要显式调用该服务。 - -Layer 子类可以通过重载 `getConfigSchema()` 方法定义自身的特有属性。例如 `PolygonLayer` 需要定义透明度，详见[ConfigSchemaValidation 使用方法](ConfigSchemaValidation.md)： -```typescript -protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } -``` - -以上就是供开发者使用的常见全局服务，下面我们将介绍场景容器及其内部服务。 - ## Scene 容器 场景可以承载多个图层，与地图底图一一对应。每个场景都有自己独立的容器确保多个场景间服务不会互相干扰，同时继承全局容器以便访问全局服务。容器内服务包括： diff --git a/packages/layers/src/Geometry/index.ts b/packages/layers/src/Geometry/index.ts index 4579e95d8d..73585574e2 100644 --- a/packages/layers/src/Geometry/index.ts +++ b/packages/layers/src/Geometry/index.ts @@ -29,17 +29,6 @@ export default class GeometryLayer extends BaseLayer< }); } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } protected getDefaultConfig() { const type = this.getModelType(); const defaultConfig = { diff --git a/packages/layers/src/Geometry/models/billboard.ts b/packages/layers/src/Geometry/models/billboard.ts index 4db2576927..bf796d7525 100644 --- a/packages/layers/src/Geometry/models/billboard.ts +++ b/packages/layers/src/Geometry/models/billboard.ts @@ -146,18 +146,6 @@ export default class BillBoardModel extends BaseModel { } } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } - protected registerBuiltinAttributes() { this.styleAttributeService.registerStyleAttribute({ name: 'extrude', diff --git a/packages/layers/src/Geometry/models/plane.ts b/packages/layers/src/Geometry/models/plane.ts index 34b7011fe4..0a66c07e57 100644 --- a/packages/layers/src/Geometry/models/plane.ts +++ b/packages/layers/src/Geometry/models/plane.ts @@ -356,18 +356,6 @@ export default class PlaneModel extends BaseModel { } } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } - protected registerBuiltinAttributes() { // point layer size; this.styleAttributeService.registerStyleAttribute({ diff --git a/packages/layers/src/Geometry/models/sprite.ts b/packages/layers/src/Geometry/models/sprite.ts index 706c701815..6885cb6a29 100644 --- a/packages/layers/src/Geometry/models/sprite.ts +++ b/packages/layers/src/Geometry/models/sprite.ts @@ -223,18 +223,6 @@ export default class SpriteModel extends BaseModel { } } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } - protected registerBuiltinAttributes() { return ''; } diff --git a/packages/layers/src/canvas/index.ts b/packages/layers/src/canvas/index.ts index aab12323c4..4d00f60793 100644 --- a/packages/layers/src/canvas/index.ts +++ b/packages/layers/src/canvas/index.ts @@ -45,17 +45,6 @@ export default class CanvasLayer extends BaseLayer { return this; } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } protected getDefaultConfig() { const type = this.getModelType(); const defaultConfig = { diff --git a/packages/layers/src/citybuliding/building.ts b/packages/layers/src/citybuliding/building.ts index f655d2695a..0b0ceae7f5 100644 --- a/packages/layers/src/citybuliding/building.ts +++ b/packages/layers/src/citybuliding/building.ts @@ -19,17 +19,6 @@ export default class CityBuildingLayer extends BaseLayer { time: t, }); } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } protected getModelType(): string { return 'citybuilding'; diff --git a/packages/layers/src/core/BaseLayer.ts b/packages/layers/src/core/BaseLayer.ts index 851022b7b7..8c69570535 100644 --- a/packages/layers/src/core/BaseLayer.ts +++ b/packages/layers/src/core/BaseLayer.ts @@ -969,7 +969,7 @@ export default class BaseLayer this.hooks.beforeDestroy.call(); // 清除sources事件 - this.layerSource.off('sourceUpdate', this.sourceEvent); + this.layerSource.off('update', this.sourceEvent); this.multiPassRenderer?.destroy(); @@ -1028,7 +1028,7 @@ export default class BaseLayer public setSource(source: Source) { // 清除旧 sources 事件 if (this.layerSource) { - this.layerSource.off('sourceUpdate', this.sourceEvent); + this.layerSource.off('update', this.sourceEvent); } this.layerSource = source; @@ -1043,17 +1043,13 @@ export default class BaseLayer if (this.layerSource.inited) { this.sourceEvent(); } - // this.layerSource.inited 为 true 后，sourceUpdate 事件不会再触发 - this.layerSource.on('sourceUpdate', () => { + // this.layerSource.inited 为 true update 事件不会再触发 + this.layerSource.on('update', () => { if (this.coordCenter === undefined) { const layerCenter = this.layerSource.center; this.coordCenter = layerCenter; - this.mapService.setCoordCenter && + this.mapService?.setCoordCenter && this.mapService.setCoordCenter(layerCenter); - // // @ts-ignore - // this.mapService.map.customCoords.setCenter(layerCenter); - // // @ts-ignore - // this.mapService.setCustomCoordCenter(layerCenter); } this.sourceEvent(); }); @@ -1358,10 +1354,6 @@ export default class BaseLayer console.warn('empty fn'); } - protected getConfigSchema() { - throw new Error('Method not implemented.'); - } - protected getModelType(): unknown { throw new Error('Method not implemented.'); } diff --git a/packages/layers/src/heatmap/index.ts b/packages/layers/src/heatmap/index.ts index a77e90907f..b6bfe2ce93 100644 --- a/packages/layers/src/heatmap/index.ts +++ b/packages/layers/src/heatmap/index.ts @@ -49,18 +49,6 @@ export default class HeatMapLayer extends BaseLayer { } } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } - protected getModelType(): HeatMapModelType { const shapeAttribute = this.styleAttributeService.getLayerStyleAttribute( 'shape', diff --git a/packages/layers/src/image/index.ts b/packages/layers/src/image/index.ts index 4df3059078..1fcb569971 100644 --- a/packages/layers/src/image/index.ts +++ b/packages/layers/src/image/index.ts @@ -15,17 +15,7 @@ export default class ImageLayer extends BaseLayer { this.dispatchModelLoad(models); }); } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } + protected getDefaultConfig() { const type = this.getModelType(); const defaultConfig = { diff --git a/packages/layers/src/image/models/dataImage.ts b/packages/layers/src/image/models/dataImage.ts index 6a1f6532ea..8399275c3a 100644 --- a/packages/layers/src/image/models/dataImage.ts +++ b/packages/layers/src/image/models/dataImage.ts @@ -120,18 +120,6 @@ export default class ImageDataModel extends BaseModel { this.initModels(callbackModel); } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } - protected registerBuiltinAttributes() { this.styleAttributeService.registerStyleAttribute({ name: 'uv', diff --git a/packages/layers/src/image/models/image.ts b/packages/layers/src/image/models/image.ts index 8dcef87fc7..bbbd2e6b22 100644 --- a/packages/layers/src/image/models/image.ts +++ b/packages/layers/src/image/models/image.ts @@ -97,18 +97,6 @@ export default class ImageModel extends BaseModel { this.initModels(callbackModel); } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } - protected registerBuiltinAttributes() { this.styleAttributeService.registerStyleAttribute({ name: 'uv', diff --git a/packages/layers/src/image/models/tileDataImage.ts b/packages/layers/src/image/models/tileDataImage.ts index 1c84439cb0..dab8e9d967 100644 --- a/packages/layers/src/image/models/tileDataImage.ts +++ b/packages/layers/src/image/models/tileDataImage.ts @@ -105,18 +105,6 @@ export default class ImageDataModel extends BaseModel { this.initModels(callbackModel); } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } - protected registerBuiltinAttributes() { this.styleAttributeService.registerStyleAttribute({ name: 'uv', diff --git a/packages/layers/src/line/index.ts b/packages/layers/src/line/index.ts index e49d975482..db22b61670 100644 --- a/packages/layers/src/line/index.ts +++ b/packages/layers/src/line/index.ts @@ -39,17 +39,6 @@ export default class LineLayer extends BaseLayer { }); } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } protected getDefaultConfig() { const type = this.getModelType(); const defaultConfig = { diff --git a/packages/layers/src/mask/index.ts b/packages/layers/src/mask/index.ts index 4801ab50ad..44f587cbd6 100644 --- a/packages/layers/src/mask/index.ts +++ b/packages/layers/src/mask/index.ts @@ -113,17 +113,6 @@ export default class MaskLayer extends BaseLayer { this.dispatchModelLoad(models); }); } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } protected getModelType(): MaskModelType { const parserType = this.layerSource.getParserType(); diff --git a/packages/layers/src/plugins/DataMappingPlugin.ts b/packages/layers/src/plugins/DataMappingPlugin.ts index 615cbfdda3..a1433a3214 100644 --- a/packages/layers/src/plugins/DataMappingPlugin.ts +++ b/packages/layers/src/plugins/DataMappingPlugin.ts @@ -37,7 +37,7 @@ export default class DataMappingPlugin implements ILayerPlugin { if (source.inited) { this.generateMaping(layer, { styleAttributeService }); } else { - source.once('sourceUpdate', () => { + source.once('update', () => { this.generateMaping(layer, { styleAttributeService }); }); } @@ -49,7 +49,7 @@ export default class DataMappingPlugin implements ILayerPlugin { if (source.inited) { this.generateMaping(layer, { styleAttributeService }); } else { - source.once('sourceUpdate', () => { + source.once('update', () => { this.generateMaping(layer, { styleAttributeService }); }); } diff --git a/packages/layers/src/plugins/DataSourcePlugin.ts b/packages/layers/src/plugins/DataSourcePlugin.ts index c03855ab40..8c6b18ee49 100644 --- a/packages/layers/src/plugins/DataSourcePlugin.ts +++ b/packages/layers/src/plugins/DataSourcePlugin.ts @@ -20,7 +20,7 @@ export default class DataSourcePlugin implements ILayerPlugin { if (source.inited) { this.updateClusterData(layer); } else { - source.once('sourceUpdate', () => { + source.once('update', () => { this.updateClusterData(layer); }); } diff --git a/packages/layers/src/plugins/FeatureScalePlugin.ts b/packages/layers/src/plugins/FeatureScalePlugin.ts index 5d4ebf7f34..58e3a05724 100644 --- a/packages/layers/src/plugins/FeatureScalePlugin.ts +++ b/packages/layers/src/plugins/FeatureScalePlugin.ts @@ -47,7 +47,7 @@ export default class FeatureScalePlugin implements ILayerPlugin { if (source.inited) { callback(source.data); } else { - source.once('sourceUpdate', () => { + source.once('update', () => { callback(source.data); }); } diff --git a/packages/layers/src/plugins/LayerModelPlugin.ts b/packages/layers/src/plugins/LayerModelPlugin.ts index af3d05e7e3..f72b83a21e 100644 --- a/packages/layers/src/plugins/LayerModelPlugin.ts +++ b/packages/layers/src/plugins/LayerModelPlugin.ts @@ -40,7 +40,7 @@ export default class LayerModelPlugin implements ILayerPlugin { if (source.inited) { this.prepareLayerModel(layer); } else { - source.once('sourceUpdate', () => { + source.once('update', () => { this.prepareLayerModel(layer); }); } diff --git a/packages/layers/src/point/index.ts b/packages/layers/src/point/index.ts index b14d8e758d..1a3ece58e7 100644 --- a/packages/layers/src/point/index.ts +++ b/packages/layers/src/point/index.ts @@ -55,17 +55,7 @@ export default class PointLayer extends BaseLayer { } return 'normal'; } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } + protected getDefaultConfig() { const type = this.getModelType(); const defaultConfig = { diff --git a/packages/layers/src/polygon/index.ts b/packages/layers/src/polygon/index.ts index bb5b2b4108..085bb99f36 100644 --- a/packages/layers/src/polygon/index.ts +++ b/packages/layers/src/polygon/index.ts @@ -26,17 +26,6 @@ export default class PolygonLayer extends BaseLayer { this.dispatchModelLoad(models); }); } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } protected getModelType(): PolygonModelType { const parserType = this.layerSource.getParserType(); diff --git a/packages/layers/src/raster/index.ts b/packages/layers/src/raster/index.ts index 80fc50bbe4..f3395b6546 100644 --- a/packages/layers/src/raster/index.ts +++ b/packages/layers/src/raster/index.ts @@ -15,17 +15,7 @@ export default class RaterLayer extends BaseLayer { this.dispatchModelLoad(models); }); } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } + protected getDefaultConfig() { const type = this.getModelType(); const defaultConfig = { diff --git a/packages/layers/src/raster/raster.ts b/packages/layers/src/raster/raster.ts index 9957958364..f3f26d0126 100644 --- a/packages/layers/src/raster/raster.ts +++ b/packages/layers/src/raster/raster.ts @@ -66,17 +66,6 @@ export default class RasterLayer extends BaseLayer { return this; } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } private buildRasterModel() { const source = this.getSource(); diff --git a/packages/layers/src/tile/tileFactory/layers/rasterDataLayer.ts b/packages/layers/src/tile/tileFactory/layers/rasterDataLayer.ts index f3dcae5138..b211b5e974 100644 --- a/packages/layers/src/tile/tileFactory/layers/rasterDataLayer.ts +++ b/packages/layers/src/tile/tileFactory/layers/rasterDataLayer.ts @@ -28,17 +28,6 @@ export default class RasterTiffLayer extends BaseLayer< return RasterModel; } } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } protected getDefaultConfig() { return {}; diff --git a/packages/layers/src/tile/tileFactory/layers/vectorLayer.ts b/packages/layers/src/tile/tileFactory/layers/vectorLayer.ts index 34dd03fbb6..2754f12c70 100644 --- a/packages/layers/src/tile/tileFactory/layers/vectorLayer.ts +++ b/packages/layers/src/tile/tileFactory/layers/vectorLayer.ts @@ -215,18 +215,6 @@ export default class VectorLayer extends BaseLayer< } } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } - protected getDefaultConfig() { return {}; } diff --git a/packages/layers/src/wind/index.ts b/packages/layers/src/wind/index.ts index 5075a8954b..56745c68d5 100644 --- a/packages/layers/src/wind/index.ts +++ b/packages/layers/src/wind/index.ts @@ -23,17 +23,7 @@ export default class WindLayer extends BaseLayer { return this; } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } + protected getDefaultConfig() { const type = this.getModelType(); const defaultConfig = { diff --git a/packages/layers/src/wind/models/wind.ts b/packages/layers/src/wind/models/wind.ts index 3ab18614a1..bcf20e9913 100644 --- a/packages/layers/src/wind/models/wind.ts +++ b/packages/layers/src/wind/models/wind.ts @@ -158,18 +158,6 @@ export default class WindModel extends BaseModel { this.wind?.destroy(); } - protected getConfigSchema() { - return { - properties: { - opacity: { - type: 'number', - minimum: 0, - maximum: 1, - }, - }, - }; - } - protected registerBuiltinAttributes() { // point layer size; this.styleAttributeService.registerStyleAttribute({ diff --git a/packages/scene/src/index.ts b/packages/scene/src/index.ts index 667c3a4bc3..74f802fe34 100644 --- a/packages/scene/src/index.ts +++ b/packages/scene/src/index.ts @@ -175,32 +175,39 @@ class Scene layer.setContainer(layerContainer, this.container); this.sceneService.addLayer(layer); - const layerConfig = layer.getLayerConfig(); - if (layerConfig) { - // 若 layer 未初始化成功，则 layerConfig 为 undefined （scene loaded 尚未执行完成） - const { - mask, - maskfence, - maskColor = '#000', - maskOpacity = 0, - } = layerConfig; - if (mask && maskfence) { - const maskInstance = new MaskLayer() - .source(maskfence) - .shape('fill') - .style({ - color: maskColor, - opacity: maskOpacity, - }); - - this.addMask(maskInstance, layer.id); - } + // mask 在 scene loaded 之后执行 + if (layer.inited) { + const maskInstance = this.initMask(layer); + this.addMask(maskInstance as ILayer, layer.id); } else { - console.warn('addLayer should run after scene loaded!'); + layer.on('inited', () => { + const maskInstance = this.initMask(layer); + this.addMask(maskInstance as ILayer, layer.id); + }) } } + public initMask(layer: ILayer) { + const { + mask, + maskfence, + maskColor = '#000', + maskOpacity = 0, + } = layer.getLayerConfig(); + if(!mask) return undefined; + + const maskInstance = new MaskLayer() + .source(maskfence) + .shape('fill') + .style({ + color: maskColor, + opacity: maskOpacity, + }); + return maskInstance; + } + public addMask(mask: ILayer, layerId: string) { + if(!mask) return; const parent = this.getLayer(layerId); if (parent) { const layerContainer = createLayerContainer(this.container); diff --git a/packages/source/src/source.ts b/packages/source/src/source.ts index 12443d7a0b..bd1dd8a661 100644 --- a/packages/source/src/source.ts +++ b/packages/source/src/source.ts @@ -234,11 +234,10 @@ export default class Source extends EventEmitter implements ISource { } private init() { - // this.hooks.init.call(this); this.inited = false; this.handleData().then(() => { this.inited = true; - this.emit('sourceUpdate'); + this.emit('update'); }); } diff --git a/packages/utils/src/lineAtOffset/index.ts b/packages/utils/src/lineAtOffset/index.ts index f13f82faad..1dfea53fbc 100644 --- a/packages/utils/src/lineAtOffset/index.ts +++ b/packages/utils/src/lineAtOffset/index.ts @@ -23,7 +23,7 @@ export function lineAtOffsetAsyc(source: Source, option: ILineAtOffset) { if (source.inited) { resolve(lineAtOffset(source, option)); } else { - source.once('sourceUpdate', () => { + source.once('update', () => { resolve(lineAtOffset(source, option)); }); } diff --git a/stories/layerbuild/components/SourceTest.tsx b/stories/layerbuild/components/SourceTest.tsx index 3f4ff29cfe..657116dde2 100644 --- a/stories/layerbuild/components/SourceTest.tsx +++ b/stories/layerbuild/components/SourceTest.tsx @@ -96,7 +96,7 @@ export default class Demo extends React.Component { }, }, ); - source.on('sourceUpdate', () => { + source.on('update', () => { const layer = new PointLayer(); layer.source(source); layer @@ -309,7 +309,7 @@ export default class Demo extends React.Component { .shape('circle') .size(10) .color('#f00'); - source.on('sourceUpdate', () => { + source.on('update', () => { layer.source(source); }); this.scene.addLayer(layer); @@ -356,7 +356,7 @@ export default class Demo extends React.Component { .shape('circle') .size(10) .color('#f00'); - source.on('sourceUpdate', () => { + source.on('update', () => { setTimeout(() => { layer.source(source); }, 2000); @@ -390,7 +390,7 @@ export default class Demo extends React.Component { .shape('circle') .size(10) .color('#f00'); - source.on('sourceUpdate', () => { + source.on('update', () => { setTimeout(() => { layer.source(source); }, 2000);