p90524618
/
antv-l7
mirror of https://gitee.com/antv-l7/antv-l7
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

chore: 移除无效的blend,mask代码

This commit is contained in:
lzxue 2023-02-14 20:57:12 +08:00
parent 4db42a1814
commit 9bc670838f
39 changed files with 198 additions and 285 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
dev-demos/features/point/demos/icons.tsx
View File

@ -51,6 +51,7 @@ export default () => {
.active(false)
.size(20);
scene.addLayer(imageLayer);
setTimeout(() => {
imageLayer.shape('02');

15
dev-demos/features/point/pointCircle.md
View File

@ -22,8 +22,10 @@ export default () => {
)
.then((res) => res.text())
.then((data) => {
const pointLayer = new PointLayer({})
.source(data.slice(0, 1000), {
const pointLayer = new PointLayer({
blend:'additive'
})
.source(data, {
parser: {
type: 'csv',
x: 'Longitude',
@ -53,10 +55,13 @@ export default () => {
strokeWidth: 0,
stroke: '#fff',
});
pointLayer.on('mousemove',(e)=>{
console.log(e);
})
scene.addLayer(pointLayer);
// let i =0;
// setInterval(() => {
// i++ % 2 === 0 ? pointLayer.setBlend('additive') : pointLayer.setBlend('normal');
// },20)
},
)

3
packages/core/src/services/layer/ILayerService.ts
View File

@ -21,6 +21,7 @@ import {
IBlendOptions,
IModel,
IModelInitializationOptions,
IStencilOptions,
} from '../renderer/IModel';
import {
IMultiPassRenderer,
@ -88,6 +89,8 @@ export interface ILayerModelInitializationOptions {
export interface ILayerModel {
render(): void;
renderUpdate?(): void;
getBlend(): Partial<IBlendOptions>;
getStencil(): Partial<IStencilOptions>;
getUninforms(): IModelUniform;
getDefaultStyle(): unknown;
getAnimateUniforms(): IModelUniform;

63
packages/core/src/services/renderer/IModel.ts
View File

@ -26,6 +26,35 @@ export interface IBlendOptions {
// gl.blendColor
color: [number, number, number, number];
}
export interface IStencilOptions {
// gl.enable(gl.STENCIL_TEST)
enable: boolean;
// gl.stencilMask
mask: number;
func: {
cmp:
| gl.NEVER
| gl.ALWAYS
| gl.LESS
| gl.LEQUAL
| gl.GREATER
| gl.GEQUAL
| gl.EQUAL
| gl.NOTEQUAL;
ref: number;
mask: number;
};
opFront: {
fail: stencilOp;
zfail: stencilOp;
zpass: stencilOp;
};
opBack: {
fail: stencilOp;
zfail: stencilOp;
zpass: stencilOp;
};
}
type stencilOp =
| gl.ZERO
| gl.KEEP
@ -185,35 +214,7 @@ export interface IModelInitializationOptions {
/**
* stencil
*/
stencil?: Partial<{
// gl.enable(gl.STENCIL_TEST)
enable: boolean;
// gl.stencilMask
mask: number;
func: {
cmp:
| gl.NEVER
| gl.ALWAYS
| gl.LESS
| gl.LEQUAL
| gl.GREATER
| gl.GEQUAL
| gl.EQUAL
| gl.NOTEQUAL;
ref: number;
mask: number;
};
opFront: {
fail: stencilOp;
zfail: stencilOp;
zpass: stencilOp;
};
opBack: {
fail: stencilOp;
zfail: stencilOp;
zpass: stencilOp;
};
}>;
stencil?: Partial<IStencilOptions>;
/**
* cull
@ -236,7 +237,9 @@ export interface IModelDrawOptions {
};
elements?: IElements;
blend?: IBlendOptions;
blend?: Partial<IBlendOptions>;
stencil?: Partial<IStencilOptions>;
}
/**

3
packages/layers/src/Geometry/models/billboard.ts
View File

@ -6,7 +6,6 @@ import {
IModelUniform,
ITexture2D,
} from '@antv/l7-core';
import { getMask } from '@antv/l7-utils';
import BaseModel from '../../core/BaseModel';
import { IGeometryLayerStyleOptions } from '../../core/interface';
import planeFrag from '../shaders/billboard_frag.glsl';
@ -104,8 +103,6 @@ export default class BillBoardModel extends BaseModel {
triangulation: this.planeGeometryTriangulation,
primitive: gl.TRIANGLES,
depth: { enable: true },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
});
return [model];
}

4
packages/layers/src/Geometry/models/plane.ts
View File

@ -8,7 +8,6 @@ import {
ITexture2D,
} from '@antv/l7-core';
import { Version } from '@antv/l7-maps';
import { getMask } from '@antv/l7-utils';
// import { mat4, vec3 } from 'gl-matrix';
import BaseModel from '../../core/BaseModel';
import { IGeometryLayerStyleOptions } from '../../core/interface';
@ -158,8 +157,7 @@ export default class PlaneModel extends BaseModel {
triangulation: this.planeGeometryTriangulation,
primitive: gl.TRIANGLES,
depth: { enable: true },
stencil: getMask(mask, maskInside),
blend: this.getBlend(),
cull: {
enable: true,
face: gl.BACK, // gl.FRONT | gl.BACK;

4
packages/layers/src/core/BaseLayer.ts
View File

@ -857,7 +857,7 @@ export default class BaseLayer<ChildLayerStyleOptions = {}>
this.updateLayerConfig({
blend: type,
});
this.layerModelNeedUpdate = true;
// this.layerModelNeedUpdate = true;
this.reRender();
return this;
}
@ -1364,6 +1364,8 @@ export default class BaseLayer<ChildLayerStyleOptions = {}>
model.draw(
{
uniforms: this.layerModel.getUninforms(),
blend: this.layerModel.getBlend(),
stencil: this.layerModel.getStencil(),
},
isPicking,
);

24
packages/layers/src/core/BaseModel.ts
View File

@ -20,6 +20,7 @@ import {
IPickingService,
IRendererService,
IShaderModuleService,
IStencilOptions,
IStyleAttributeService,
ITexture2D,
ITexture2DInitializationOptions,
@ -27,7 +28,7 @@ import {
Triangulation,
TYPES,
} from '@antv/l7-core';
import { rgb2arr } from '@antv/l7-utils';
import { getMask, rgb2arr } from '@antv/l7-utils';
import { color } from 'd3-color';
import { isEqual, isNumber, isString } from 'lodash';
import { BlendTypes } from '../utils/blend';
@ -501,6 +502,27 @@ export default class BaseModel<ChildLayerStyleOptions = {}>
const { blend = 'normal' } = this.layer.getLayerConfig();
return BlendTypes[BlendType[blend]] as IBlendOptions;
}
public getStencil(): Partial<IStencilOptions> {
const { mask = false, maskInside = true } = this.layer.getLayerConfig();
// TODO 临时处理，后期移除MaskLayer
if (this.layer.type === 'MaskLayer') {
return {
enable: true,
mask: 0xff,
func: {
cmp: gl.ALWAYS,
ref: 1,
mask: 0xff,
},
opFront: {
fail: gl.REPLACE,
zfail: gl.REPLACE,
zpass: gl.REPLACE,
},
};
}
return getMask(mask, maskInside);
}
public getDefaultStyle(): unknown {
return {};
}

4
packages/layers/src/heatmap/models/grid.ts
View File

@ -5,7 +5,6 @@ import {
IModel,
IModelUniform,
} from '@antv/l7-core';
import { getMask } from '@antv/l7-utils';
import BaseModel from '../../core/BaseModel';
import { IHeatMapLayerStyleOptions } from '../../core/interface';
import { HeatmapGridTriangulation } from '../../core/triangulation';
@ -31,8 +30,6 @@ export default class GridModel extends BaseModel {
}
public async buildModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IHeatMapLayerStyleOptions;
const model = await this.layer.buildLayerModel({
moduleName: 'heatmapGrid',
vertexShader: heatmapGridVert,
@ -40,7 +37,6 @@ export default class GridModel extends BaseModel {
triangulation: HeatmapGridTriangulation,
primitive: gl.TRIANGLES,
depth: { enable: false },
stencil: getMask(mask, maskInside),
});
return [model];
}

5
packages/layers/src/heatmap/models/grid3d.ts
View File

@ -5,7 +5,6 @@ import {
IModel,
IModelUniform,
} from '@antv/l7-core';
import { getMask } from '@antv/l7-utils';
import BaseModel from '../../core/BaseModel';
import { IHeatMapLayerStyleOptions } from '../../core/interface';
import { PointExtrudeTriangulation } from '../../core/triangulation';
@ -31,8 +30,6 @@ export default class Grid3DModel extends BaseModel {
}
public async buildModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IHeatMapLayerStyleOptions;
const model = await this.layer.buildLayerModel({
moduleName: 'heatmapGrid3d',
vertexShader: heatmapGrid3dVert,
@ -40,8 +37,6 @@ export default class Grid3DModel extends BaseModel {
triangulation: PointExtrudeTriangulation,
primitive: gl.TRIANGLES,
depth: { enable: true },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
});
return [model];
}

14
packages/layers/src/heatmap/models/heatmap.ts
View File

@ -7,12 +7,7 @@ import {
IModelUniform,
ITexture2D,
} from '@antv/l7-core';
import {
generateColorRamp,
getCullFace,
getMask,
IColorRamp,
} from '@antv/l7-utils';
import { generateColorRamp, getCullFace, IColorRamp } from '@antv/l7-utils';
import { mat4 } from 'gl-matrix';
import { injectable } from 'inversify';
import 'reflect-metadata';
@ -167,8 +162,6 @@ export default class HeatMapModel extends BaseModel {
}
private buildHeatmapColor(): IModel {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IHeatMapLayerStyleOptions;
this.shaderModuleService.registerModule('heatmapColor', {
vs: heatmapColorVert,
fs: heatmapColorFrag,
@ -203,13 +196,11 @@ export default class HeatMapModel extends BaseModel {
depth: {
enable: false,
},
blend: this.getBlend(),
elements: createElements({
data: [0, 2, 1, 2, 3, 1],
type: gl.UNSIGNED_INT,
count: 6,
}),
stencil: getMask(mask, maskInside),
});
}
@ -275,8 +266,6 @@ export default class HeatMapModel extends BaseModel {
});
}
private build3dHeatMap() {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IHeatMapLayerStyleOptions;
const { getViewportSize } = this.rendererService;
const { width, height } = getViewportSize();
const triangulation = heatMap3DTriangulation(width / 4.0, height / 4.0);
@ -329,7 +318,6 @@ export default class HeatMapModel extends BaseModel {
type: gl.UNSIGNED_INT,
count: triangulation.indices.length,
}),
stencil: getMask(mask, maskInside),
});
}
private updateStyle() {

5
packages/layers/src/heatmap/models/hexagon.ts
View File

@ -5,7 +5,6 @@ import {
IModel,
IModelUniform,
} from '@antv/l7-core';
import { getMask } from '@antv/l7-utils';
import BaseModel from '../../core/BaseModel';
import { IHeatMapLayerStyleOptions } from '../../core/interface';
import { HeatmapGridTriangulation } from '../../core/triangulation';
@ -32,8 +31,6 @@ export default class HexagonModel extends BaseModel {
}
public async buildModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IHeatMapLayerStyleOptions;
const model = await this.layer.buildLayerModel({
moduleName: 'heatmapHexagon',
vertexShader: heatmapGridVert,
@ -41,8 +38,6 @@ export default class HexagonModel extends BaseModel {
triangulation: HeatmapGridTriangulation,
depth: { enable: false },
primitive: gl.TRIANGLES,
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
});
return [model];
}

6
packages/layers/src/image/models/image.ts
View File

@ -6,7 +6,7 @@ import {
IModelUniform,
ITexture2D,
} from '@antv/l7-core';
import { getMask, isMini } from '@antv/l7-utils';
import { isMini } from '@antv/l7-utils';
import BaseModel from '../../core/BaseModel';
import { IImageLayerStyleOptions } from '../../core/interface';
import { RasterImageTriangulation } from '../../core/triangulation';
@ -24,9 +24,6 @@ export default class ImageModel extends BaseModel {
}
public async initModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IImageLayerStyleOptions;
const source = this.layer.getSource();
const { createTexture2D } = this.rendererService;
this.texture = createTexture2D({
@ -72,7 +69,6 @@ export default class ImageModel extends BaseModel {
enable: true,
},
depth: { enable: false },
stencil: getMask(mask, maskInside),
});
return [model];
}

4
packages/layers/src/line/models/arc.ts
View File

@ -8,7 +8,7 @@ import {
IModelUniform,
ITexture2D,
} from '@antv/l7-core';
import { getMask, rgb2arr } from '@antv/l7-utils';
import { rgb2arr } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { ILineLayerStyleOptions } from '../../core/interface';
@ -183,9 +183,7 @@ export default class ArcModel extends BaseModel {
fragmentShader: frag,
triangulation: LineArcTriangulation,
depth: { enable: false },
blend: this.getBlend(),
segmentNumber,
stencil: getMask(mask, maskInside),
});
return [model];
}

4
packages/layers/src/line/models/arc_3d.ts
View File

@ -8,7 +8,7 @@ import {
IModelUniform,
ITexture2D,
} from '@antv/l7-core';
import { getMask, rgb2arr } from '@antv/l7-utils';
import { rgb2arr } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { ILineLayerStyleOptions } from '../../core/interface';
@ -169,9 +169,7 @@ export default class Arc3DModel extends BaseModel {
vertexShader: vert,
fragmentShader: frag,
triangulation: LineArcTriangulation,
blend: this.getBlend(),
segmentNumber,
stencil: getMask(mask, maskInside),
});
return [model];
}

4
packages/layers/src/line/models/earthArc_3d.ts
View File

@ -8,7 +8,7 @@ import {
IModelUniform,
ITexture2D,
} from '@antv/l7-core';
import { getMask, rgb2arr } from '@antv/l7-utils';
import { rgb2arr } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { ILineLayerStyleOptions } from '../../core/interface';
@ -169,9 +169,7 @@ export default class Arc3DModel extends BaseModel {
fragmentShader: frag,
triangulation: LineArcTriangulation,
depth: { enable: true },
blend: this.getBlend(),
segmentNumber,
stencil: getMask(mask, maskInside),
});
return [model];
}

6
packages/layers/src/line/models/great_circle.ts
View File

@ -8,7 +8,7 @@ import {
IModelUniform,
ITexture2D,
} from '@antv/l7-core';
import { getMask, rgb2arr } from '@antv/l7-utils';
import { rgb2arr } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { ILineLayerStyleOptions } from '../../core/interface';
@ -126,16 +126,12 @@ export default class GreatCircleModel extends BaseModel {
}
public async buildModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as ILineLayerStyleOptions;
const model = await this.layer.buildLayerModel({
moduleName: 'lineGreatCircle',
vertexShader: line_arc2d_vert,
fragmentShader: line_arc_frag,
triangulation: LineArcTriangulation,
depth: { enable: false },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
});
return [model];
}

4
packages/layers/src/line/models/half.ts
View File

@ -5,7 +5,7 @@ import {
IModel,
IModelUniform,
} from '@antv/l7-core';
import { getMask, rgb2arr } from '@antv/l7-utils';
import { rgb2arr } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { ILineLayerStyleOptions } from '../../core/interface';
@ -107,8 +107,6 @@ export default class LineModel extends BaseModel {
fragmentShader: frag,
triangulation: LineTriangulation,
depth: { enable: depth },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
});
return [model];
}

5
packages/layers/src/line/models/line.ts
View File

@ -8,7 +8,7 @@ import {
IModelUniform,
ITexture2D,
} from '@antv/l7-core';
import { getMask, LineTriangulation, rgb2arr } from '@antv/l7-utils';
import { LineTriangulation, rgb2arr } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import {
@ -194,8 +194,7 @@ export default class LineModel extends BaseModel {
fragmentShader: frag,
triangulation: LineTriangulation,
depth: { enable: depth },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
workerEnabled,
workerOptions: {
modelType: 'line' + type,

4
packages/layers/src/line/models/linearline.ts
View File

@ -6,7 +6,7 @@ import {
IModelUniform,
ITexture2D,
} from '@antv/l7-core';
import { generateColorRamp, getMask, IColorRamp } from '@antv/l7-utils';
import { generateColorRamp, IColorRamp } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { ILineLayerStyleOptions, LinearDir } from '../../core/interface';
@ -101,8 +101,6 @@ export default class LinearLineModel extends BaseModel {
fragmentShader: linear_line_frag,
triangulation: LineTriangulation,
depth: { enable: depth },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
});
return [model];
}

8
packages/layers/src/line/models/simpleLine.ts
View File

@ -5,7 +5,7 @@ import {
IModel,
IModelUniform,
} from '@antv/l7-core';
import { getMask, rgb2arr } from '@antv/l7-utils';
import { rgb2arr } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { ILineLayerStyleOptions } from '../../core/interface';
@ -106,9 +106,6 @@ export default class SimpleLineModel extends BaseModel {
}
public async buildModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as ILineLayerStyleOptions;
const { frag, vert, type } = this.getShaders();
const model = await this.layer.buildLayerModel({
@ -118,8 +115,7 @@ export default class SimpleLineModel extends BaseModel {
triangulation: SimpleLineTriangulation,
primitive: gl.LINES,
depth: { enable: false },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
pick: false,
});
return [model];

1
packages/layers/src/mask/models/fill.ts
View File

@ -28,7 +28,6 @@ export default class MaskModel extends BaseModel {
fragmentShader: mask_frag,
triangulation: polygonTriangulation,
depth: { enable: false },
blend: this.getBlend(),
stencil: {
enable: true,
mask: 0xff,

1
packages/layers/src/point/models/extrude.ts
View File

@ -144,7 +144,6 @@ export default class ExtrudeModel extends BaseModel {
vertexShader: pointExtrudeVert,
fragmentShader: pointExtrudeFrag,
triangulation: PointExtrudeTriangulation,
blend: this.getBlend(),
cull: {
enable: true,
face: getCullFace(this.mapService.version),

5
packages/layers/src/point/models/fill.ts
View File

@ -9,7 +9,7 @@ import {
IModel,
IModelUniform,
} from '@antv/l7-core';
import { getMask, PointFillTriangulation } from '@antv/l7-utils';
import { PointFillTriangulation } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { IPointLayerStyleOptions, SizeUnitType } from '../../core/interface';
@ -141,8 +141,7 @@ export default class FillModel extends BaseModel {
fragmentShader: frag,
triangulation: PointFillTriangulation,
depth: { enable: false },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
workerEnabled,
workerOptions: {
modelType: type,

7
packages/layers/src/point/models/fillmage.ts
View File

@ -8,7 +8,7 @@ import {
IModelUniform,
ITexture2D,
} from '@antv/l7-core';
import { getCullFace, getMask } from '@antv/l7-utils';
import { getCullFace } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { IPointLayerStyleOptions, SizeUnitType } from '../../core/interface';
@ -138,16 +138,13 @@ export default class FillImageModel extends BaseModel {
}
public async buildModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IPointLayerStyleOptions;
const model = await this.layer.buildLayerModel({
moduleName: 'pointFillImage',
vertexShader: pointFillVert,
fragmentShader: pointFillFrag,
triangulation: PointFillTriangulation,
depth: { enable: false },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
cull: {
enable: true,
face: getCullFace(this.mapService.version),

6
packages/layers/src/point/models/image.ts
View File

@ -6,7 +6,6 @@ import {
IModelUniform,
ITexture2D,
} from '@antv/l7-core';
import { getMask } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { IPointLayerStyleOptions } from '../../core/interface';
@ -93,9 +92,6 @@ export default class ImageModel extends BaseModel {
}
public async buildModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IPointLayerStyleOptions;
const model = await this.layer.buildLayerModel({
moduleName: 'pointImage',
vertexShader: pointImageVert,
@ -103,8 +99,6 @@ export default class ImageModel extends BaseModel {
triangulation: PointImageTriangulation,
depth: { enable: false },
primitive: gl.POINTS,
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
});
return [model];

6
packages/layers/src/point/models/normal.ts
View File

@ -5,7 +5,6 @@ import {
IModel,
IModelUniform,
} from '@antv/l7-core';
import { getMask } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { IPointLayerStyleOptions } from '../../core/interface';
@ -41,8 +40,6 @@ export default class NormalModel extends BaseModel {
}
public async buildModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IPointLayerStyleOptions;
this.layer.triangulation = PointTriangulation;
const model = await this.layer.buildLayerModel({
@ -52,8 +49,7 @@ export default class NormalModel extends BaseModel {
triangulation: PointTriangulation,
depth: { enable: false },
primitive: gl.POINTS,
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
pick: false,
});
return [model];

6
packages/layers/src/point/models/radar.ts
View File

@ -9,7 +9,6 @@ import {
IModel,
IModelUniform,
} from '@antv/l7-core';
import { getMask } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { IPointLayerStyleOptions, SizeUnitType } from '../../core/interface';
@ -60,17 +59,12 @@ export default class RadarModel extends BaseModel {
}
public async buildModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IPointLayerStyleOptions;
const model = await this.layer.buildLayerModel({
moduleName: 'pointRadar',
vertexShader: pointFillVert,
fragmentShader: pointFillFrag,
triangulation: PointFillTriangulation,
depth: { enable: false },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
});
return [model];
}

5
packages/layers/src/point/models/simplePoint.ts
View File

@ -5,7 +5,6 @@ import {
IModel,
IModelUniform,
} from '@antv/l7-core';
import { getMask } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { IPointLayerStyleOptions } from '../../core/interface';
@ -97,8 +96,6 @@ export default class SimplePointModel extends BaseModel {
}
public async buildModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IPointLayerStyleOptions;
this.layer.triangulation = PointTriangulation;
const model = await this.layer.buildLayerModel({
@ -108,8 +105,6 @@ export default class SimplePointModel extends BaseModel {
triangulation: PointTriangulation,
depth: { enable: false },
primitive: gl.POINTS,
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
});
return [model];
}

13
packages/layers/src/point/models/text.ts
View File

@ -6,12 +6,7 @@ import {
IModelUniform,
ITexture2D,
} from '@antv/l7-core';
import {
boundsContains,
calculateCentroid,
getMask,
padBounds,
} from '@antv/l7-utils';
import { boundsContains, calculateCentroid, padBounds } from '@antv/l7-utils';
import { isEqual, isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { IPointLayerStyleOptions } from '../../core/interface';
@ -200,8 +195,6 @@ export default class TextModel extends BaseModel {
fragmentShader: textFrag,
triangulation: TextTriangulation.bind(this),
depth: { enable: false },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
});
return [model];
}
@ -568,8 +561,6 @@ export default class TextModel extends BaseModel {
}
private async reBuildModel() {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IPointLayerStyleOptions;
this.filterGlyphs();
const model = await this.layer.buildLayerModel({
moduleName: 'pointText',
@ -577,8 +568,6 @@ export default class TextModel extends BaseModel {
fragmentShader: textFrag,
triangulation: TextTriangulation.bind(this),
depth: { enable: false },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
});
// TODO 渲染流程待修改
this.layer.models = [model];

6
packages/layers/src/polygon/models/extrude.ts
View File

@ -5,7 +5,7 @@ import {
IModel,
ITexture2D,
} from '@antv/l7-core';
import { getMask, rgb2arr } from '@antv/l7-utils';
import { rgb2arr } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { IPolygonLayerStyleOptions } from '../../core/interface';
@ -99,16 +99,12 @@ export default class ExtrudeModel extends BaseModel {
}
public async buildModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IPolygonLayerStyleOptions;
const { frag, vert, type } = this.getShaders();
const model = await this.layer.buildLayerModel({
moduleName: type,
vertexShader: vert,
fragmentShader: frag,
triangulation: PolygonExtrudeTriangulation,
stencil: getMask(mask, maskInside),
});
return [model];
}

5
packages/layers/src/polygon/models/fill.ts
View File

@ -6,7 +6,7 @@ import {
IModel,
Triangulation,
} from '@antv/l7-core';
import { getMask, polygonFillTriangulation } from '@antv/l7-utils';
import { polygonFillTriangulation } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { IPolygonLayerStyleOptions } from '../../core/interface';
@ -90,8 +90,7 @@ export default class FillModel extends BaseModel {
triangulation,
primitive: gl.TRIANGLES,
depth: { enable: false },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
workerEnabled,
workerOptions: {
modelType: type,

5
packages/layers/src/polygon/models/ocean.ts
View File

@ -7,7 +7,7 @@ import {
ITexture2D,
} from '@antv/l7-core';
import { Version } from '@antv/l7-maps';
import { getMask, rgb2arr } from '@antv/l7-utils';
import { rgb2arr } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { IPolygonLayerStyleOptions } from '../../core/interface';
@ -47,8 +47,6 @@ export default class OceanModel extends BaseModel {
}
public async buildModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IPolygonLayerStyleOptions;
const model = await this.layer.buildLayerModel({
moduleName: 'polygonOcean',
vertexShader: ocean_vert,
@ -56,7 +54,6 @@ export default class OceanModel extends BaseModel {
triangulation: polygonTriangulation,
primitive: gl.TRIANGLES,
depth: { enable: false },
stencil: getMask(mask, maskInside),
});
return [model];
}

4
packages/layers/src/polygon/models/water.ts
View File

@ -7,7 +7,6 @@ import {
ITexture2D,
} from '@antv/l7-core';
import { Version } from '@antv/l7-maps';
import { getMask } from '@antv/l7-utils';
import { isNumber } from 'lodash';
import BaseModel from '../../core/BaseModel';
import { IPolygonLayerStyleOptions } from '../../core/interface';
@ -38,8 +37,6 @@ export default class WaterModel extends BaseModel {
}
public async buildModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IPolygonLayerStyleOptions;
const model = await this.layer.buildLayerModel({
moduleName: 'polygonWater',
vertexShader: water_vert,
@ -47,7 +44,6 @@ export default class WaterModel extends BaseModel {
triangulation: polygonTriangulation,
primitive: gl.TRIANGLES,
depth: { enable: false },
stencil: getMask(mask, maskInside),
});
return [model];
}

5
packages/layers/src/raster/models/raster.ts
View File

@ -5,7 +5,7 @@ import {
IModel,
ITexture2D,
} from '@antv/l7-core';
import { getDefaultDomain, getMask } from '@antv/l7-utils';
import { getDefaultDomain } from '@antv/l7-utils';
import BaseModel from '../../core/BaseModel';
import { IRasterLayerStyleOptions } from '../../core/interface';
import { RasterImageTriangulation } from '../../core/triangulation';
@ -59,8 +59,6 @@ export default class RasterModel extends BaseModel {
}
public async initModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IRasterLayerStyleOptions;
const source = this.layer.getSource();
const { createTexture2D } = this.rendererService;
const parserDataItem = source.data.dataArray[0];
@ -83,7 +81,6 @@ export default class RasterModel extends BaseModel {
triangulation: RasterImageTriangulation,
primitive: gl.TRIANGLES,
depth: { enable: false },
stencil: getMask(mask, maskInside),
});
return [model];
}

4
packages/layers/src/raster/models/rasterRgb.ts
View File

@ -5,7 +5,6 @@ import {
IModel,
ITexture2D,
} from '@antv/l7-core';
import { getMask } from '@antv/l7-utils';
import BaseModel from '../../core/BaseModel';
import { IRasterLayerStyleOptions } from '../../core/interface';
import { RasterImageTriangulation } from '../../core/triangulation';
@ -58,8 +57,6 @@ export default class RasterModel extends BaseModel {
}
public async initModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IRasterLayerStyleOptions;
const source = this.layer.getSource();
const { createTexture2D } = this.rendererService;
const parserDataItem = source.data.dataArray[0];
@ -80,7 +77,6 @@ export default class RasterModel extends BaseModel {
triangulation: RasterImageTriangulation,
primitive: gl.TRIANGLES,
depth: { enable: false },
stencil: getMask(mask, maskInside),
});
return [model];
}

7
packages/layers/src/raster/models/rasterTerrainRgb.ts
View File

@ -6,7 +6,7 @@ import {
IModelUniform,
ITexture2D,
} from '@antv/l7-core';
import { getDefaultDomain, getMask } from '@antv/l7-utils';
import { getDefaultDomain } from '@antv/l7-utils';
import BaseModel from '../../core/BaseModel';
import { IRasterLayerStyleOptions } from '../../core/interface';
import { RasterImageTriangulation } from '../../core/triangulation';
@ -50,9 +50,6 @@ export default class RasterTerrainRGB extends BaseModel {
};
}
public async initModels(): Promise<IModel[]> {
const { mask = false, maskInside = true } =
this.layer.getLayerConfig() as IRasterLayerStyleOptions;
const source = this.layer.getSource();
const { createTexture2D } = this.rendererService;
const imageData = await source.data.images;
@ -69,8 +66,6 @@ export default class RasterTerrainRGB extends BaseModel {
triangulation: RasterImageTriangulation,
primitive: gl.TRIANGLES,
depth: { enable: false },
blend: this.getBlend(),
stencil: getMask(mask, maskInside),
});
return [model];
}

3
packages/layers/src/wind/models/wind.ts
View File

@ -7,7 +7,7 @@ import {
ITexture2D,
Point,
} from '@antv/l7-core';
import { FrequencyController, getMask } from '@antv/l7-utils';
import { FrequencyController } from '@antv/l7-utils';
import BaseModel from '../../core/BaseModel';
import { IWindLayerStyleOptions } from '../../core/interface';
import { RasterImageTriangulation } from '../../core/triangulation';
@ -120,7 +120,6 @@ export default class WindModel extends BaseModel {
triangulation: RasterImageTriangulation,
primitive: gl.TRIANGLES,
depth: { enable: false },
stencil: getMask(mask, maskInside),
blend: this.getBlend(),
});
this.colorModel = model;

204
packages/renderer/src/regl/ReglModel.ts
View File

@ -1,6 +1,7 @@
import {
gl,
IAttribute,
IBlendOptions,
IElements,
IModel,
IModelDrawOptions,
@ -49,8 +50,6 @@ export default class ReglModel implements IModel {
count,
elements,
depth,
blend,
stencil,
cull,
instances,
} = options;
@ -74,7 +73,28 @@ export default class ReglModel implements IModel {
frag: fs,
uniforms: reglUniforms,
vert: vs,
blend: {},
blend: {
// @ts-ignore
enable: reGl.prop('blend.enable'),
// @ts-ignore
func: reGl.prop('blend.func'),
// @ts-ignore
equation: reGl.prop('blend.equation'),
// @ts-ignore
color: reGl.prop('blend.color'),
},
stencil: {
// @ts-ignore
enable: reGl.prop('stencil.enable'),
// @ts-ignore
mask: reGl.prop('stencil.mask'),
// @ts-ignore
func: reGl.prop('stencil.func'),
// @ts-ignore
opFront: reGl.prop('stencil.opFront'),
// @ts-ignore
opBack: reGl.prop('stencil.opBack'),
},
primitive:
primitiveMap[primitive === undefined ? gl.TRIANGLES : primitive],
};
@ -92,22 +112,10 @@ export default class ReglModel implements IModel {
}
this.initDepthDrawParams({ depth }, drawParams);
this.initBlendDrawParams({ blend }, drawParams);
this.initStencilDrawParams({ stencil }, drawParams);
// this.initBlendDrawParams({ blend }, drawParams);
// this.initStencilDrawParams({ stencil }, drawParams);
this.initCullDrawParams({ cull }, drawParams);
this.drawCommand = reGl(drawParams);
if (pick) {
const pickDrawParams = cloneDeep(drawParams);
pickDrawParams.blend = {
...pickDrawParams.blend,
enable: false,
};
this.drawPickCommand = reGl(pickDrawParams);
}
this.drawParams = drawParams;
}
@ -123,15 +131,6 @@ export default class ReglModel implements IModel {
this.drawParams.elements = (elements as ReglElements).get();
this.drawCommand = this.reGl(this.drawParams);
if (this.options.pick) {
const pickDrawParams = cloneDeep(this.drawParams);
pickDrawParams.blend = {
...pickDrawParams.blend,
enable: false,
};
this.drawPickCommand = this.reGl(pickDrawParams);
}
}
public updateAttributes(attributes: { [key: string]: IAttribute }) {
@ -181,6 +180,7 @@ export default class ReglModel implements IModel {
| regl.Texture2D
| number
| number[]
| Partial<IBlendOptions>
| boolean;
} = {};
Object.keys(uniforms).forEach((uniformName: string) => {
@ -202,16 +202,20 @@ export default class ReglModel implements IModel {
).get();
}
});
// 更新 blend
// @ts-ignore
reglDrawProps.blend = pick
? this.getBlendDrawParams({
blend: { enable: false },
})
: this.getBlendDrawParams(options);
// 更新stentil 配置
// @ts-ignore
reglDrawProps.stencil = this.getStencilDrawParams(options);
// 在进行拾取操作的绘制中，不应该使用叠加模式 - picking 根据拾取的颜色作为判断的输入，而叠加模式会产生新的，在 id 序列中不存在的颜色
if (!pick) {
this.drawCommand(reglDrawProps);
} else {
if (this.drawPickCommand) {
this.drawPickCommand(reglDrawProps);
}
}
// this.drawCommand(reglDrawProps);
// this.drawPickCommand(reglDrawProps);
this.drawCommand(reglDrawProps);
}
public destroy() {
@ -243,80 +247,70 @@ export default class ReglModel implements IModel {
}
}
/**
* @see https://github.com/regl-project/regl/blob/gh-pages/API.md#blending
*/
private initBlendDrawParams(
{ blend }: Pick<IModelInitializationOptions, 'blend'>,
drawParams: regl.DrawConfig,
) {
if (blend) {
const { enable, func, equation, color = [0, 0, 0, 0] } = blend;
// @ts-ignore
drawParams.blend = {
enable: !!enable,
func: {
srcRGB: blendFuncMap[(func && func.srcRGB) || gl.SRC_ALPHA],
srcAlpha: blendFuncMap[(func && func.srcAlpha) || gl.SRC_ALPHA],
dstRGB: blendFuncMap[(func && func.dstRGB) || gl.ONE_MINUS_SRC_ALPHA],
dstAlpha:
blendFuncMap[(func && func.dstAlpha) || gl.ONE_MINUS_SRC_ALPHA],
},
equation: {
rgb: blendEquationMap[(equation && equation.rgb) || gl.FUNC_ADD],
alpha: blendEquationMap[(equation && equation.alpha) || gl.FUNC_ADD],
},
color,
};
}
private getBlendDrawParams({
blend,
}: Pick<IModelInitializationOptions, 'blend'>) {
const { enable, func, equation, color = [0, 0, 0, 0] } = blend || {};
// @ts-ignore
return {
enable: !!enable,
func: {
srcRGB: blendFuncMap[(func && func.srcRGB) || gl.SRC_ALPHA],
srcAlpha: blendFuncMap[(func && func.srcAlpha) || gl.SRC_ALPHA],
dstRGB: blendFuncMap[(func && func.dstRGB) || gl.ONE_MINUS_SRC_ALPHA],
dstAlpha:
blendFuncMap[(func && func.dstAlpha) || gl.ONE_MINUS_SRC_ALPHA],
},
equation: {
rgb: blendEquationMap[(equation && equation.rgb) || gl.FUNC_ADD],
alpha: blendEquationMap[(equation && equation.alpha) || gl.FUNC_ADD],
},
color,
};
}
/**
* @see https://github.com/regl-project/regl/blob/gh-pages/API.md#stencil
*/
private initStencilDrawParams(
{ stencil }: Pick<IModelInitializationOptions, 'stencil'>,
drawParams: regl.DrawConfig,
) {
if (stencil) {
const {
enable,
mask = -1,
func = {
cmp: gl.ALWAYS,
ref: 0,
mask: -1,
},
opFront = {
fail: gl.KEEP,
zfail: gl.KEEP,
zpass: gl.KEEP,
},
opBack = {
fail: gl.KEEP,
zfail: gl.KEEP,
zpass: gl.KEEP,
},
} = stencil;
drawParams.stencil = {
enable: !!enable,
mask,
func: {
...func,
cmp: stencilFuncMap[func.cmp],
},
opFront: {
fail: stencilOpMap[opFront.fail],
zfail: stencilOpMap[opFront.zfail],
zpass: stencilOpMap[opFront.zpass],
},
opBack: {
fail: stencilOpMap[opBack.fail],
zfail: stencilOpMap[opBack.zfail],
zpass: stencilOpMap[opBack.zpass],
},
};
}
private getStencilDrawParams({
stencil,
}: Pick<IModelInitializationOptions, 'stencil'>) {
const {
enable,
mask = -1,
func = {
cmp: gl.ALWAYS,
ref: 0,
mask: -1,
},
opFront = {
fail: gl.KEEP,
zfail: gl.KEEP,
zpass: gl.KEEP,
},
opBack = {
fail: gl.KEEP,
zfail: gl.KEEP,
zpass: gl.KEEP,
},
} = stencil || {};
return {
enable: !!enable,
mask,
func: {
...func,
cmp: stencilFuncMap[func.cmp],
},
opFront: {
fail: stencilOpMap[opFront.fail],
zfail: stencilOpMap[opFront.zfail],
zpass: stencilOpMap[opFront.zpass],
},
opBack: {
fail: stencilOpMap[opBack.fail],
zfail: stencilOpMap[opBack.zfail],
zpass: stencilOpMap[opBack.zpass],
},
};
}
/**