From b060f6fca730194a8fa81c3e8ad698271eea9e1f Mon Sep 17 00:00:00 2001 From: thinkinggis Date: Tue, 30 Jun 2020 15:23:40 +0800 Subject: [PATCH] =?UTF-8?q?chore(layer):=20regl=20=E5=AF=B9=E8=B1=A1?= =?UTF-8?q?=E9=94=80=E6=AF=81=E9=97=AE=E9=A2=98,=E6=95=B0=E6=8D=AE?= =?UTF-8?q?=E9=A2=91=E7=B9=81=E6=9B=B4=E6=96=B0=E5=87=8F=E5=B0=91=E5=86=85?= =?UTF-8?q?=E5=AD=98=E5=8D=A0=E7=94=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit fix #412 --- examples/heatmap/heatmap/demo/heatmap3d.js | 4 ++-- .../core/src/services/layer/ILayerService.ts | 4 ++++ .../core/src/services/layer/LayerService.ts | 1 - .../services/layer/StyleAttributeService.ts | 2 ++ packages/layers/src/citybuliding/building.ts | 3 +++ .../layers/src/citybuliding/models/build.ts | 2 +- packages/layers/src/core/BaseLayer.ts | 7 +++++- packages/layers/src/core/BaseModel.ts | 3 +++ packages/layers/src/heatmap/index.ts | 3 +++ packages/layers/src/heatmap/models/grid.ts | 4 ++++ packages/layers/src/heatmap/models/grid3d.ts | 4 ++++ packages/layers/src/heatmap/models/heatmap.ts | 7 +++++- packages/layers/src/heatmap/models/hexagon.ts | 4 ++++ packages/layers/src/image/index.ts | 3 +++ packages/layers/src/image/models/image.ts | 5 +++- packages/layers/src/line/index.ts | 3 +++ packages/layers/src/line/models/arc.ts | 4 ++++ packages/layers/src/line/models/arc_3d.ts | 4 ++++ .../layers/src/line/models/great_circle.ts | 4 ++++ packages/layers/src/line/models/line.ts | 4 ++++ .../layers/src/plugins/DataMappingPlugin.ts | 3 +++ .../layers/src/plugins/FeatureScalePlugin.ts | 4 ++++ .../layers/src/plugins/LayerModelPlugin.ts | 4 +++- .../src/plugins/UpdateStyleAttributePlugin.ts | 8 +++---- packages/layers/src/point/index.ts | 5 ++++ packages/layers/src/point/models/extrude.ts | 3 +++ packages/layers/src/point/models/fill.ts | 3 +++ packages/layers/src/point/models/icon-font.ts | 2 +- packages/layers/src/point/models/image.ts | 10 ++++++-- packages/layers/src/point/models/normal.ts | 5 ++++ packages/layers/src/point/models/text.ts | 9 +++++++- packages/layers/src/polygon/index.ts | 4 +++- packages/layers/src/polygon/models/extrude.ts | 4 ++++ packages/layers/src/polygon/models/fill.ts | 4 ++++ packages/layers/src/raster/index.ts | 3 +++ packages/layers/src/raster/models/raster.ts | 5 +++- packages/renderer/package.json | 2 +- packages/renderer/src/regl/ReglModel.ts | 23 ++++++++++++++++++- packages/source/src/source.ts | 14 ++++++----- yarn.lock | 8 +++---- 40 files changed, 168 insertions(+), 30 deletions(-) diff --git a/examples/heatmap/heatmap/demo/heatmap3d.js b/examples/heatmap/heatmap/demo/heatmap3d.js index 643d46efc2..fe09db80d4 100644 --- a/examples/heatmap/heatmap/demo/heatmap3d.js +++ b/examples/heatmap/heatmap/demo/heatmap3d.js @@ -1,9 +1,9 @@ import { Scene, HeatmapLayer } from '@antv/l7'; -import { Mapbox } from '@antv/l7-maps'; +import { GaodeMap } from '@antv/l7-maps'; const scene = new Scene({ id: 'map', - map: new Mapbox({ + map: new GaodeMap({ style: 'dark', pitch: 58.5, center: [ 111.8759, 30.6942 ], diff --git a/packages/core/src/services/layer/ILayerService.ts b/packages/core/src/services/layer/ILayerService.ts index 21b23ff79b..6b0b498f9c 100644 --- a/packages/core/src/services/layer/ILayerService.ts +++ b/packages/core/src/services/layer/ILayerService.ts @@ -57,6 +57,7 @@ export interface ILayerModel { getDefaultStyle(): unknown; getAnimateUniforms(): IModelUniform; buildModels(): IModel[]; + initModels(): IModel[]; needUpdate(): boolean; } export interface IModelUniform { @@ -117,6 +118,7 @@ export interface ILayer { prepareBuildModel(): void; renderModels(): void; buildModels(): void; + rebuildModels(): void; buildLayerModel( options: ILayerModelInitializationOptions & Partial, @@ -154,6 +156,8 @@ export interface ILayer { setBlend(type: keyof typeof BlendType): void; // animate(field: string, option: any): ILayer; render(): ILayer; + clear(): void; + clearModels(): void; destroy(): void; source(data: any, option?: ISourceCFG): ILayer; setData(data: any, option?: ISourceCFG): ILayer; diff --git a/packages/core/src/services/layer/LayerService.ts b/packages/core/src/services/layer/LayerService.ts index 1cd1c04e77..e5792471c6 100644 --- a/packages/core/src/services/layer/LayerService.ts +++ b/packages/core/src/services/layer/LayerService.ts @@ -92,7 +92,6 @@ export default class LayerService implements ILayerService { this.layers.sort((pre: ILayer, next: ILayer) => { return pre.zIndex - next.zIndex; }); - this.renderLayers(); } public destroy() { diff --git a/packages/core/src/services/layer/StyleAttributeService.ts b/packages/core/src/services/layer/StyleAttributeService.ts index 5933052960..7007e2a5d5 100644 --- a/packages/core/src/services/layer/StyleAttributeService.ts +++ b/packages/core/src/services/layer/StyleAttributeService.ts @@ -320,6 +320,8 @@ export default class StyleAttributeService implements IStyleAttributeService { attribute.vertexAttribute.destroy(); } }); + + this.attributesAndIndices.elements.destroy(); this.attributes = []; } } diff --git a/packages/layers/src/citybuliding/building.ts b/packages/layers/src/citybuliding/building.ts index 790ccfcede..267e620449 100644 --- a/packages/layers/src/citybuliding/building.ts +++ b/packages/layers/src/citybuliding/building.ts @@ -6,6 +6,9 @@ export default class CityBuildingLayer extends BaseLayer { public type: string = 'PolygonLayer'; public buildModels() { this.layerModel = new CityBuildModel(this); + this.models = this.layerModel.initModels(); + } + public rebuildModels() { this.models = this.layerModel.buildModels(); } public setLight(t: number) { diff --git a/packages/layers/src/citybuliding/models/build.ts b/packages/layers/src/citybuliding/models/build.ts index 7ac5d6b047..0f433dbcc2 100644 --- a/packages/layers/src/citybuliding/models/build.ts +++ b/packages/layers/src/citybuliding/models/build.ts @@ -29,7 +29,7 @@ export default class CityBuildModel extends BaseModel { }; } - public buildModels(): IModel[] { + public initModels(): IModel[] { this.startModelAnimate(); return [ this.layer.buildLayerModel({ diff --git a/packages/layers/src/core/BaseLayer.ts b/packages/layers/src/core/BaseLayer.ts index 3134472e24..c635575324 100644 --- a/packages/layers/src/core/BaseLayer.ts +++ b/packages/layers/src/core/BaseLayer.ts @@ -708,7 +708,7 @@ export default class BaseLayer extends EventEmitter // 清除所有属性以及关联的 vao this.styleAttributeService.clearAllAttributes(); // 销毁所有 model - this.models.forEach((model) => model.destroy()); + // this.models.forEach((model) => model.destroy()); this.hooks.afterDestroy.call(); @@ -725,6 +725,8 @@ export default class BaseLayer extends EventEmitter public clear() { this.styleAttributeService.clearAllAttributes(); // 销毁所有 model + } + public clearModels() { this.models.forEach((model) => model.destroy()); } @@ -886,6 +888,9 @@ export default class BaseLayer extends EventEmitter public buildModels() { throw new Error('Method not implemented.'); } + public rebuildModels() { + throw new Error('Method not implemented.'); + } public renderModels() { if (this.layerModelNeedUpdate && this.layerModel) { diff --git a/packages/layers/src/core/BaseModel.ts b/packages/layers/src/core/BaseModel.ts index 79dd167b5a..0ae666efdc 100644 --- a/packages/layers/src/core/BaseModel.ts +++ b/packages/layers/src/core/BaseModel.ts @@ -97,6 +97,9 @@ export default class BaseModel public buildModels(): IModel[] { throw new Error('Method not implemented.'); } + public initModels(): IModel[] { + throw new Error('Method not implemented.'); + } public getAttribute(): { attributes: { [attributeName: string]: IAttribute; diff --git a/packages/layers/src/heatmap/index.ts b/packages/layers/src/heatmap/index.ts index 801d0af946..421309dbd9 100644 --- a/packages/layers/src/heatmap/index.ts +++ b/packages/layers/src/heatmap/index.ts @@ -10,6 +10,9 @@ export default class HeatMapLayer extends BaseLayer { public buildModels() { const shape = this.getModelType(); this.layerModel = new HeatMapModels[shape](this); + this.models = this.layerModel.initModels(); + } + public rebuildModels() { this.models = this.layerModel.buildModels(); } public renderModels() { diff --git a/packages/layers/src/heatmap/models/grid.ts b/packages/layers/src/heatmap/models/grid.ts index e3d83025f2..2d650495d3 100644 --- a/packages/layers/src/heatmap/models/grid.ts +++ b/packages/layers/src/heatmap/models/grid.ts @@ -32,6 +32,10 @@ export default class GridModel extends BaseModel { }; } + public initModels(): IModel[] { + return this.buildModels(); + } + public buildModels(): IModel[] { return [ this.layer.buildLayerModel({ diff --git a/packages/layers/src/heatmap/models/grid3d.ts b/packages/layers/src/heatmap/models/grid3d.ts index c5c05f7037..bcdce935c0 100644 --- a/packages/layers/src/heatmap/models/grid3d.ts +++ b/packages/layers/src/heatmap/models/grid3d.ts @@ -33,6 +33,10 @@ export default class Grid3DModel extends BaseModel { }; } + public initModels(): IModel[] { + return this.buildModels(); + } + public buildModels(): IModel[] { return [ this.layer.buildLayerModel({ diff --git a/packages/layers/src/heatmap/models/heatmap.ts b/packages/layers/src/heatmap/models/heatmap.ts index de989581db..11c1388844 100644 --- a/packages/layers/src/heatmap/models/heatmap.ts +++ b/packages/layers/src/heatmap/models/heatmap.ts @@ -52,7 +52,7 @@ export default class HeatMapModel extends BaseModel { throw new Error('Method not implemented.'); } - public buildModels(): IModel[] { + public initModels(): IModel[] { const { createFramebuffer, clear, @@ -106,6 +106,11 @@ export default class HeatMapModel extends BaseModel { return [this.intensityModel, this.colorModel]; } + + public buildModels(): IModel[] { + return this.initModels(); + } + protected registerBuiltinAttributes() { this.styleAttributeService.registerStyleAttribute({ name: 'dir', diff --git a/packages/layers/src/heatmap/models/hexagon.ts b/packages/layers/src/heatmap/models/hexagon.ts index 0da3a9dfac..bc80073ef9 100644 --- a/packages/layers/src/heatmap/models/hexagon.ts +++ b/packages/layers/src/heatmap/models/hexagon.ts @@ -34,6 +34,10 @@ export default class HexagonModel extends BaseModel { }; } + public initModels(): IModel[] { + return this.buildModels(); + } + public buildModels(): IModel[] { return [ this.layer.buildLayerModel({ diff --git a/packages/layers/src/image/index.ts b/packages/layers/src/image/index.ts index 7aad124e61..2ed4e2b664 100644 --- a/packages/layers/src/image/index.ts +++ b/packages/layers/src/image/index.ts @@ -8,6 +8,9 @@ export default class ImageLayer extends BaseLayer { public buildModels() { const modelType = this.getModelType(); this.layerModel = new ImageModels[modelType](this); + this.models = this.layerModel.initModels(); + } + public rebuildModels() { this.models = this.layerModel.buildModels(); } protected getConfigSchema() { diff --git a/packages/layers/src/image/models/image.ts b/packages/layers/src/image/models/image.ts index 29bf661046..00ff412705 100644 --- a/packages/layers/src/image/models/image.ts +++ b/packages/layers/src/image/models/image.ts @@ -31,7 +31,7 @@ export default class ImageModel extends BaseModel { u_texture: this.texture, }; } - public buildModels() { + public initModels() { const source = this.layer.getSource(); const { createTexture2D } = this.rendererService; this.texture = createTexture2D({ @@ -58,6 +58,9 @@ export default class ImageModel extends BaseModel { }), ]; } + public buildModels() { + return this.initModels(); + } protected getConfigSchema() { return { diff --git a/packages/layers/src/line/index.ts b/packages/layers/src/line/index.ts index 6280b78af3..5517840db0 100644 --- a/packages/layers/src/line/index.ts +++ b/packages/layers/src/line/index.ts @@ -8,6 +8,9 @@ export default class LineLayer extends BaseLayer { public buildModels() { const shape = this.getModelType(); this.layerModel = new LineModels[shape](this); + this.models = this.layerModel.initModels(); + } + public rebuildModels() { this.models = this.layerModel.buildModels(); } diff --git a/packages/layers/src/line/models/arc.ts b/packages/layers/src/line/models/arc.ts index fc72303963..4d694b1681 100644 --- a/packages/layers/src/line/models/arc.ts +++ b/packages/layers/src/line/models/arc.ts @@ -44,6 +44,10 @@ export default class ArcModel extends BaseModel { }; } + public initModels(): IModel[] { + return this.buildModels(); + } + public buildModels(): IModel[] { return [ this.layer.buildLayerModel({ diff --git a/packages/layers/src/line/models/arc_3d.ts b/packages/layers/src/line/models/arc_3d.ts index 3bdb40fc3d..a3c03dfa0b 100644 --- a/packages/layers/src/line/models/arc_3d.ts +++ b/packages/layers/src/line/models/arc_3d.ts @@ -41,6 +41,10 @@ export default class Arc3DModel extends BaseModel { }; } + public initModels(): IModel[] { + return this.buildModels(); + } + public buildModels(): IModel[] { return [ this.layer.buildLayerModel({ diff --git a/packages/layers/src/line/models/great_circle.ts b/packages/layers/src/line/models/great_circle.ts index cb0479616f..81143bbc84 100644 --- a/packages/layers/src/line/models/great_circle.ts +++ b/packages/layers/src/line/models/great_circle.ts @@ -43,6 +43,10 @@ export default class GreatCircleModel extends BaseModel { }; } + public initModels(): IModel[] { + return this.buildModels(); + } + public buildModels(): IModel[] { return [ this.layer.buildLayerModel({ diff --git a/packages/layers/src/line/models/line.ts b/packages/layers/src/line/models/line.ts index 366a4c1429..3425fe3fce 100644 --- a/packages/layers/src/line/models/line.ts +++ b/packages/layers/src/line/models/line.ts @@ -41,6 +41,10 @@ export default class LineModel extends BaseModel { }; } + public initModels(): IModel[] { + return this.buildModels(); + } + public buildModels(): IModel[] { return [ this.layer.buildLayerModel({ diff --git a/packages/layers/src/plugins/DataMappingPlugin.ts b/packages/layers/src/plugins/DataMappingPlugin.ts index 03f50479fa..cdc8082b4e 100644 --- a/packages/layers/src/plugins/DataMappingPlugin.ts +++ b/packages/layers/src/plugins/DataMappingPlugin.ts @@ -39,6 +39,9 @@ export default class DataMappingPlugin implements ILayerPlugin { // remapping before render layer.hooks.beforeRender.tap('DataMappingPlugin', () => { + if (layer.layerModelNeedUpdate) { + return; + } const attributes = styleAttributeService.getLayerStyleAttributes() || []; const filter = styleAttributeService.getLayerStyleAttribute('filter'); const { dataArray } = layer.getSource().data; diff --git a/packages/layers/src/plugins/FeatureScalePlugin.ts b/packages/layers/src/plugins/FeatureScalePlugin.ts index 13b78511b8..3819a5f008 100644 --- a/packages/layers/src/plugins/FeatureScalePlugin.ts +++ b/packages/layers/src/plugins/FeatureScalePlugin.ts @@ -76,10 +76,14 @@ export default class FeatureScalePlugin implements ILayerPlugin { // return; // } this.caculateScalesForAttributes(attributes || [], dataArray); + layer.layerModelNeedUpdate = true; return true; }); layer.hooks.beforeRender.tap('FeatureScalePlugin', () => { + if (layer.layerModelNeedUpdate) { + return; + } this.scaleOptions = layer.getScaleOptions(); const attributes = styleAttributeService.getLayerStyleAttributes(); if (attributes) { diff --git a/packages/layers/src/plugins/LayerModelPlugin.ts b/packages/layers/src/plugins/LayerModelPlugin.ts index d618272ad5..1443545ef8 100644 --- a/packages/layers/src/plugins/LayerModelPlugin.ts +++ b/packages/layers/src/plugins/LayerModelPlugin.ts @@ -16,8 +16,10 @@ export default class LayerModelPlugin implements ILayerPlugin { layer.hooks.beforeRenderData.tap('DataSourcePlugin', () => { // 更新Model 配置项 layer.prepareBuildModel(); + + layer.clearModels(); // 初始化 Model - layer.buildModels(); + layer.rebuildModels(); layer.layerModelNeedUpdate = false; return false; }); diff --git a/packages/layers/src/plugins/UpdateStyleAttributePlugin.ts b/packages/layers/src/plugins/UpdateStyleAttributePlugin.ts index dddb64840f..9ec4f14e96 100644 --- a/packages/layers/src/plugins/UpdateStyleAttributePlugin.ts +++ b/packages/layers/src/plugins/UpdateStyleAttributePlugin.ts @@ -25,10 +25,10 @@ export default class UpdateStyleAttributePlugin implements ILayerPlugin { this.initStyleAttribute(layer, { styleAttributeService }); }); - layer.hooks.beforeRenderData.tap('styleAttributeService', () => { - layer.layerModelNeedUpdate = true; - return true; - }); + // layer.hooks.beforeRenderData.tap('styleAttributeService', () => { + // // layer.layerModelNeedUpdate = true; + // return true; + // }); layer.hooks.beforeRender.tap('UpdateStyleAttributePlugin', () => { if (layer.layerModelNeedUpdate) { diff --git a/packages/layers/src/point/index.ts b/packages/layers/src/point/index.ts index 38400fce42..3fdb53704c 100644 --- a/packages/layers/src/point/index.ts +++ b/packages/layers/src/point/index.ts @@ -11,6 +11,11 @@ export default class PointLayer extends BaseLayer { public buildModels() { const modelType = this.getModelType(); this.layerModel = new PointModels[modelType](this); + this.models = this.layerModel.initModels(); + } + public rebuildModels() { + // const modelType = this.getModelType(); + // this.layerModel = new PointModels[modelType](this); this.models = this.layerModel.buildModels(); } protected getConfigSchema() { diff --git a/packages/layers/src/point/models/extrude.ts b/packages/layers/src/point/models/extrude.ts index ffa3e0e97a..769b42073e 100644 --- a/packages/layers/src/point/models/extrude.ts +++ b/packages/layers/src/point/models/extrude.ts @@ -14,6 +14,9 @@ export default class ExtrudeModel extends BaseModel { u_opacity: opacity || 1.0, }; } + public initModels(): IModel[] { + return this.buildModels(); + } public buildModels(): IModel[] { return [ diff --git a/packages/layers/src/point/models/fill.ts b/packages/layers/src/point/models/fill.ts index 112fdd0654..b62a7d2016 100644 --- a/packages/layers/src/point/models/fill.ts +++ b/packages/layers/src/point/models/fill.ts @@ -54,6 +54,9 @@ export default class FillModel extends BaseModel { PointFillTriangulation, ); } + public initModels(): IModel[] { + return this.buildModels(); + } public buildModels(): IModel[] { return [ this.layer.buildLayerModel({ diff --git a/packages/layers/src/point/models/icon-font.ts b/packages/layers/src/point/models/icon-font.ts index b9cb6ededd..a49a2180cd 100644 --- a/packages/layers/src/point/models/icon-font.ts +++ b/packages/layers/src/point/models/icon-font.ts @@ -29,7 +29,7 @@ export default class IconeModel extends BaseModel { }; } - public buildModels(): IModel[] { + public initModels(): IModel[] { this.initIconFontGlyphs(); this.registerBuiltinAttributes(); this.updateTexture(); diff --git a/packages/layers/src/point/models/image.ts b/packages/layers/src/point/models/image.ts index 44d3719889..8e194dcf16 100644 --- a/packages/layers/src/point/models/image.ts +++ b/packages/layers/src/point/models/image.ts @@ -30,13 +30,17 @@ export default class ImageModel extends BaseModel { }; } - public buildModels(): IModel[] { + public initModels(): IModel[] { this.registerBuiltinAttributes(); this.updateTexture(); this.iconService.on('imageUpdate', () => { this.updateTexture(); this.layer.render(); // TODO 调用全局render }); + return this.buildModels(); + } + + public buildModels(): IModel[] { return [ this.layer.buildLayerModel({ moduleName: 'pointImage', @@ -49,7 +53,6 @@ export default class ImageModel extends BaseModel { }), ]; } - protected registerBuiltinAttributes() { // point layer size; this.styleAttributeService.registerStyleAttribute({ @@ -107,6 +110,9 @@ export default class ImageModel extends BaseModel { private updateTexture() { const { createTexture2D } = this.rendererService; + if (this.texture) { + this.texture.destroy(); + } this.texture = createTexture2D({ data: this.iconService.getCanvas(), mag: gl.LINEAR, diff --git a/packages/layers/src/point/models/normal.ts b/packages/layers/src/point/models/normal.ts index b7edfbb95e..7d81cb2e8e 100644 --- a/packages/layers/src/point/models/normal.ts +++ b/packages/layers/src/point/models/normal.ts @@ -45,6 +45,11 @@ export default class NormalModel extends BaseModel { u_stroke_color: rgb2arr(stroke), }; } + + public initModels(): IModel[] { + return this.buildModels(); + } + public buildModels(): IModel[] { return [ this.layer.buildLayerModel({ diff --git a/packages/layers/src/point/models/text.ts b/packages/layers/src/point/models/text.ts index 652512d8c7..7d9bf4592f 100644 --- a/packages/layers/src/point/models/text.ts +++ b/packages/layers/src/point/models/text.ts @@ -140,7 +140,7 @@ export default class TextModel extends BaseModel { }; } - public buildModels(): IModel[] { + public initModels(): IModel[] { this.layer.on('remapping', () => { this.initGlyph(); this.updateTexture(); @@ -155,6 +155,10 @@ export default class TextModel extends BaseModel { textAnchor, textAllowOverlap, }; + return this.buildModels(); + } + + public buildModels(): IModel[] { this.initGlyph(); this.updateTexture(); this.filterGlyphs(); @@ -390,6 +394,9 @@ export default class TextModel extends BaseModel { const { createTexture2D } = this.rendererService; const { canvas } = this.fontService; this.textureHeight = canvas.height; + if (this.texture) { + this.texture.destroy(); + } this.texture = createTexture2D({ data: canvas, mag: gl.LINEAR, diff --git a/packages/layers/src/polygon/index.ts b/packages/layers/src/polygon/index.ts index f8e7d36cb7..f426ee2b1f 100644 --- a/packages/layers/src/polygon/index.ts +++ b/packages/layers/src/polygon/index.ts @@ -12,9 +12,11 @@ export default class PolygonLayer extends BaseLayer { public buildModels() { const shape = this.getModelType(); this.layerModel = new PolygonModels[shape](this); + this.models = this.layerModel.initModels(); + } + public rebuildModels() { this.models = this.layerModel.buildModels(); } - protected getConfigSchema() { return { properties: { diff --git a/packages/layers/src/polygon/models/extrude.ts b/packages/layers/src/polygon/models/extrude.ts index 96e93d19f7..0dbb46d6a4 100644 --- a/packages/layers/src/polygon/models/extrude.ts +++ b/packages/layers/src/polygon/models/extrude.ts @@ -16,6 +16,10 @@ export default class ExtrudeModel extends BaseModel { }; } + public initModels(): IModel[] { + return this.buildModels(); + } + public buildModels(): IModel[] { return [ this.layer.buildLayerModel({ diff --git a/packages/layers/src/polygon/models/fill.ts b/packages/layers/src/polygon/models/fill.ts index 5bf7cc3db9..e849dd3b22 100644 --- a/packages/layers/src/polygon/models/fill.ts +++ b/packages/layers/src/polygon/models/fill.ts @@ -29,6 +29,10 @@ export default class FillModel extends BaseModel { }; } + public initModels(): IModel[] { + return this.buildModels(); + } + public buildModels(): IModel[] { return [ this.layer.buildLayerModel({ diff --git a/packages/layers/src/raster/index.ts b/packages/layers/src/raster/index.ts index f6c0692877..a14b9c97ed 100644 --- a/packages/layers/src/raster/index.ts +++ b/packages/layers/src/raster/index.ts @@ -14,6 +14,9 @@ export default class RaterLayer extends BaseLayer { public buildModels() { const modelType = this.getModelType(); this.layerModel = new RasterModels[modelType](this); + this.models = this.layerModel.initModels(); + } + public rebuildModels() { this.models = this.layerModel.buildModels(); } protected getConfigSchema() { diff --git a/packages/layers/src/raster/models/raster.ts b/packages/layers/src/raster/models/raster.ts index 255e46291d..a7b3f66e75 100644 --- a/packages/layers/src/raster/models/raster.ts +++ b/packages/layers/src/raster/models/raster.ts @@ -50,7 +50,7 @@ export default class RasterModel extends BaseModel { }; } - public buildModels() { + public initModels() { const source = this.layer.getSource(); const { createTexture2D } = this.rendererService; const parserDataItem = source.data.dataArray[0]; @@ -85,6 +85,9 @@ export default class RasterModel extends BaseModel { ]; } + public buildModels() { + return this.initModels(); + } protected registerBuiltinAttributes() { // point layer size; this.styleAttributeService.registerStyleAttribute({ diff --git a/packages/renderer/package.json b/packages/renderer/package.json index 7c64a46b4f..596f15bd20 100644 --- a/packages/renderer/package.json +++ b/packages/renderer/package.json @@ -30,7 +30,7 @@ "inversify": "^5.0.1", "lodash": "^4.17.15", "reflect-metadata": "^0.1.13", - "regl": "1.3.13" + "regl": "^1.6.1" }, "gitHead": "532ade40831b35b04a677b351d092e54c00613d8", "publishConfig": { diff --git a/packages/renderer/src/regl/ReglModel.ts b/packages/renderer/src/regl/ReglModel.ts index abbe3d1d51..ebd17a696b 100644 --- a/packages/renderer/src/regl/ReglModel.ts +++ b/packages/renderer/src/regl/ReglModel.ts @@ -1,5 +1,6 @@ import { gl, + IAttribute, IModel, IModelDrawOptions, IModelInitializationOptions, @@ -26,7 +27,10 @@ import ReglTexture2D from './ReglTexture2D'; */ export default class ReglModel implements IModel { private reGl: regl.Regl; + private destroyed: boolean = false; private drawCommand: regl.DrawCommand; + private drawParams: regl.DrawConfig; + private options: IModelInitializationOptions; private uniforms: { [key: string]: IUniform; } = {}; @@ -48,6 +52,7 @@ export default class ReglModel implements IModel { instances, } = options; const reglUniforms: { [key: string]: IUniform } = {}; + this.options = options; if (uniforms) { this.uniforms = this.extractUniforms(uniforms); Object.keys(uniforms).forEach((uniformName) => { @@ -86,7 +91,9 @@ export default class ReglModel implements IModel { this.initBlendDrawParams({ blend }, drawParams); this.initStencilDrawParams({ stencil }, drawParams); this.initCullDrawParams({ cull }, drawParams); + this.drawCommand = reGl(drawParams); + this.drawParams = drawParams; } public addUniforms(uniforms: { [key: string]: IUniform }) { @@ -97,6 +104,12 @@ export default class ReglModel implements IModel { } public draw(options: IModelDrawOptions) { + if ( + this.drawParams.attributes && + Object.keys(this.drawParams.attributes).length === 0 + ) { + return; + } const uniforms: { [key: string]: IUniform; } = { @@ -135,7 +148,15 @@ export default class ReglModel implements IModel { } public destroy() { - // don't need do anything since we will call `rendererService.cleanup()` + // @ts-ignore + this.drawParams.elements.destroy(); + if (this.options.attributes) { + Object.values(this.options.attributes).forEach((attr: any) => { + // @ts-ignore + (attr as ReglAttribute).destroy(); + }); + } + this.destroyed = true; } /** diff --git a/packages/source/src/source.ts b/packages/source/src/source.ts index ba40800f55..1b45557862 100644 --- a/packages/source/src/source.ts +++ b/packages/source/src/source.ts @@ -147,6 +147,14 @@ export default class Source extends EventEmitter { return feature?._id; } + public destroy() { + this.removeAllListeners(); + this.originData = null; + this.clusterIndex = null; + // @ts-ignore + this.data = null; + } + private initCfg(cfg?: ISourceCFG) { if (cfg) { if (cfg.parser) { @@ -192,12 +200,6 @@ export default class Source extends EventEmitter { const clusterOptions = this.clusterOptions || {}; this.clusterIndex = cluster(this.data, clusterOptions); - // this.clusterIndex = new Supercluster({ - // radius, - // minZoom, - // maxZoom, - // }); - // this.clusterIndex.load(this.rawData.features); } private init() { diff --git a/yarn.lock b/yarn.lock index 912b559b75..b82b1fb084 100644 --- a/yarn.lock +++ b/yarn.lock @@ -22417,10 +22417,10 @@ regjsparser@^0.6.4: dependencies: jsesc "~0.5.0" -regl@1.3.13: - version "1.3.13" - resolved "https://registry.npmjs.org/regl/-/regl-1.3.13.tgz#c376bfa6477995a9be9cd21495a0c9beb9b2f3af" - integrity sha512-TTiCabJbbUykCL4otjqOvKqDFJhvJOT7xB51JxcDeSHGrEJl1zz4RthPcoOogqfuR3ECN4Te790DfHCXzli5WQ== +regl@^1.6.1: + version "1.6.1" + resolved "https://registry.npmjs.org/regl/-/regl-1.6.1.tgz#6930172cda9b8fb65724abc0d4930d79333f5460" + integrity sha512-7Z9rmpEqmLNwC9kCYCyfyu47eWZaQWeNpwZfwz99QueXN8B/Ow40DB0N+OeUeM/yu9pZAB01+JgJ+XghGveVoA== rehype-react@^5.0.0: version "5.0.1"