diff --git a/packages/core/src/services/layer/ILayerService.ts b/packages/core/src/services/layer/ILayerService.ts index bc36c8e6e6..c27272ea1a 100644 --- a/packages/core/src/services/layer/ILayerService.ts +++ b/packages/core/src/services/layer/ILayerService.ts @@ -57,6 +57,7 @@ export interface ILayerModelInitializationOptions { vertexShader: string; fragmentShader: string; triangulation: Triangulation; + segmentNumber?: number; } export interface ILayerModel { diff --git a/packages/core/src/services/layer/IStyleAttributeService.ts b/packages/core/src/services/layer/IStyleAttributeService.ts index 2bfd8844d4..5ca0af48a3 100644 --- a/packages/core/src/services/layer/IStyleAttributeService.ts +++ b/packages/core/src/services/layer/IStyleAttributeService.ts @@ -161,6 +161,7 @@ export interface IStyleAttribute extends IStyleAttributeInitializationOptions { export type Triangulation = ( feature: IEncodeFeature, + segmentNumber?: number, ) => { vertices: number[]; indices: number[]; @@ -197,6 +198,7 @@ export interface IStyleAttributeService { createAttributesAndIndices( encodedFeatures: IEncodeFeature[], triangulation?: Triangulation, + segmentNumber?: number, ): { attributes: { [attributeName: string]: IAttribute; diff --git a/packages/core/src/services/layer/StyleAttributeService.ts b/packages/core/src/services/layer/StyleAttributeService.ts index 699036afd2..d7af836380 100644 --- a/packages/core/src/services/layer/StyleAttributeService.ts +++ b/packages/core/src/services/layer/StyleAttributeService.ts @@ -187,6 +187,7 @@ export default class StyleAttributeService implements IStyleAttributeService { public createAttributesAndIndices( features: IEncodeFeature[], triangulation: Triangulation, + segmentNumber: number, ): { attributes: { [attributeName: string]: IAttribute; @@ -217,7 +218,7 @@ export default class StyleAttributeService implements IStyleAttributeService { vertices: verticesForCurrentFeature, normals: normalsForCurrentFeature, size: vertexSize, - } = this.triangulation(feature); + } = this.triangulation(feature, segmentNumber); indicesForCurrentFeature.forEach((i) => { indices.push(i + verticesNum); }); diff --git a/packages/layers/src/core/BaseLayer.ts b/packages/layers/src/core/BaseLayer.ts index d987ae15b4..1c0b5eac20 100644 --- a/packages/layers/src/core/BaseLayer.ts +++ b/packages/layers/src/core/BaseLayer.ts @@ -858,6 +858,7 @@ export default class BaseLayer extends EventEmitter vertexShader, fragmentShader, triangulation, + segmentNumber, ...rest } = options; this.shaderModuleService.registerModule(moduleName, { @@ -872,6 +873,7 @@ export default class BaseLayer extends EventEmitter } = this.styleAttributeService.createAttributesAndIndices( this.encodedData, triangulation, + segmentNumber, ); return createModel({ attributes, diff --git a/packages/layers/src/core/triangulation.ts b/packages/layers/src/core/triangulation.ts index 483c6953f9..b455863c65 100644 --- a/packages/layers/src/core/triangulation.ts +++ b/packages/layers/src/core/triangulation.ts @@ -202,8 +202,11 @@ export function RasterImageTriangulation(feature: IEncodeFeature) { * @param feature 映射数据 * @param segNum 弧线线段数 */ -export function LineArcTriangulation(feature: IEncodeFeature) { - const segNum = 30; +export function LineArcTriangulation( + feature: IEncodeFeature, + segmentNumber?: number, +) { + const segNum = segmentNumber ? segmentNumber : 30; const coordinates = feature.coordinates as IPosition[]; const positions = []; const indexArray = []; diff --git a/packages/layers/src/line/models/arc.ts b/packages/layers/src/line/models/arc.ts index 58a06f1304..42c1ff60bd 100644 --- a/packages/layers/src/line/models/arc.ts +++ b/packages/layers/src/line/models/arc.ts @@ -33,6 +33,7 @@ export default class ArcModel extends BaseModel { forward = true, lineTexture = false, iconStep = 100, + segmentNumber = 30, } = this.layer.getLayerConfig() as ILineLayerStyleOptions; if (this.dataTextureTest && this.dataTextureNeedUpdate({ opacity })) { @@ -89,7 +90,7 @@ export default class ArcModel extends BaseModel { u_opacity: isNumber(opacity) ? opacity : 1.0, u_textureBlend: textureBlend === 'normal' ? 0.0 : 1.0, - segmentNumber: 30, + segmentNumber, u_line_type: lineStyleObj[lineType || 'solid'], u_dash_array: dashArray, u_blur: 0.9, @@ -131,6 +132,10 @@ export default class ArcModel extends BaseModel { } public buildModels(): IModel[] { + const { + segmentNumber = 30, + } = this.layer.getLayerConfig() as ILineLayerStyleOptions; + return [ this.layer.buildLayerModel({ moduleName: 'arc2dline', @@ -139,6 +144,7 @@ export default class ArcModel extends BaseModel { triangulation: LineArcTriangulation, depth: { enable: false }, blend: this.getBlend(), + segmentNumber, }), ]; } diff --git a/packages/layers/src/line/models/arc_3d.ts b/packages/layers/src/line/models/arc_3d.ts index f0d8f4e823..c4428e4a64 100644 --- a/packages/layers/src/line/models/arc_3d.ts +++ b/packages/layers/src/line/models/arc_3d.ts @@ -31,6 +31,7 @@ export default class Arc3DModel extends BaseModel { dashArray = [10, 5], lineTexture = false, iconStep = 100, + segmentNumber = 30, } = this.layer.getLayerConfig() as ILineLayerStyleOptions; if (dashArray.length === 2) { @@ -87,7 +88,7 @@ export default class Arc3DModel extends BaseModel { // u_opacity: opacity === undefined ? 1 : opacity, u_opacity: isNumber(opacity) ? opacity : 1.0, u_textureBlend: textureBlend === 'normal' ? 0.0 : 1.0, - segmentNumber: 30, + segmentNumber, u_line_type: lineStyleObj[lineType as string] || 0.0, u_dash_array: dashArray, diff --git a/packages/layers/src/line/models/great_circle.ts b/packages/layers/src/line/models/great_circle.ts index aeb6c06ac7..492d8442df 100644 --- a/packages/layers/src/line/models/great_circle.ts +++ b/packages/layers/src/line/models/great_circle.ts @@ -34,6 +34,7 @@ export default class GreatCircleModel extends BaseModel { dashArray = [10, 5], lineTexture = false, iconStep = 100, + segmentNumber = 30, } = this.layer.getLayerConfig() as Partial; // console.log('opacity', opacity) if (dashArray.length === 2) { @@ -90,7 +91,7 @@ export default class GreatCircleModel extends BaseModel { // u_opacity: opacity === undefined ? 1 : opacity, u_opacity: isNumber(opacity) ? opacity : 1.0, u_textureBlend: textureBlend === 'normal' ? 0.0 : 1.0, - segmentNumber: 30, + segmentNumber, u_line_type: lineStyleObj[lineType as string] || 0.0, u_dash_array: dashArray, diff --git a/stories/Map/components/amap2demo_arcLine.tsx b/stories/Map/components/amap2demo_arcLine.tsx index 991bc8bff7..8493614fc9 100644 --- a/stories/Map/components/amap2demo_arcLine.tsx +++ b/stories/Map/components/amap2demo_arcLine.tsx @@ -44,8 +44,9 @@ export default class Amap2demo_arcLine extends React.Component { .style({ opacity: 0.8, blur: 0.99, - lineType: 'dash', - dashArray: [5, 5], + segmentNumber: 3, + // lineType: 'dash', + // dashArray: [5, 5], }); // .forward(false) scene.addLayer(layer); diff --git a/stories/Map/components/amap2demo_image.tsx b/stories/Map/components/amap2demo_image.tsx index fdd4dc4aa8..4ef6897006 100644 --- a/stories/Map/components/amap2demo_image.tsx +++ b/stories/Map/components/amap2demo_image.tsx @@ -73,7 +73,7 @@ export default class Amap2demo_image extends React.Component { ]; scene.addImage( '00', - 'https://gw.alipayobjects.com/zos/basement_prod/604b5e7f-309e-40db-b95b-4fac746c5153.svg' + 'https://gw.alipayobjects.com/zos/basement_prod/604b5e7f-309e-40db-b95b-4fac746c5153.svg', // "https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*qYtMTanpMOcAAAAAAAAAAAAAARQnAQ" // 'https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*nGW2RZ3j8c8AAAAAAAAAAAAAARQnAQ' // 'https://gw.alipayobjects.com/zos/bmw-prod/8eee5dbd-c3f5-4806-a9b5-5c8e90d8510c.svg' @@ -89,16 +89,16 @@ export default class Amap2demo_image extends React.Component { scene.on('loaded', () => { this.imageLayer = new PointLayer() - .source(originData, { + .source(originData, { parser: { type: 'json', x: 'longitude', y: 'latitude', }, }) - .shape('name', ['00', '01','02']) - .size(20) - scene.addLayer(this.imageLayer) + .shape('name', ['00', '01', '02']) + .size(20); + scene.addLayer(this.imageLayer); }); }