有了上一章說Primiteve圖層 我們就可以定義豐富數(shù)據(jù)圖層
比如我們定義水面 圖層
先定義水面圖層參數(shù)定義
export interface PWaterPrimitives{
id: string,
source:?Array<number>,
symbol?: {
url?: string,
height?: number,
baseWaterColor?: any,?//rgba顏色對象的水的基本顏色。
blendColor?: any,?//rgba顏色對象沐序，當(dāng)混合從水到非水區(qū)域
frequency?: number,?//頻率:控制波的數(shù)量鹰服。
animationSpeed?: number,?//控制水的動畫速度的數(shù)字
amplitude?: number,?//振幅:控制水波振幅的數(shù)字
specularIntensity?: number,?//鏡面反射強(qiáng)度:控制鏡面反射強(qiáng)度的數(shù)字
},
}
export interface PPrimitiveWaterLayer {
name: string,
primitives:Array<PWaterPrimitives>
}
水面圖層
``javascript import { PPrimitiveWaterLayer,PWaterPrimitives } from "./PPrimitiveWaterLayer"; import { PrimiteveLayer } from "./PrimiteveLayer"; const FS =varying vec3 v_positionMC;
varying vec3 v_positionEC;
varying vec2 v_st;
void main()
{
czm_materialInput materialInput;
vec3 normalEC = normalize(czm_normal3D * czm_geodeticSurfaceNormal(v_positionMC, vec3(0.0), vec3(1.0)));
#ifdef FACE_FORWARD
normalEC = faceforward(normalEC, vec3(0.0, 0.0, 1.0), -normalEC);
#endif
materialInput.s = v_st.s;
materialInput.st = v_st;
materialInput.str = vec3(v_st, 0.0);
materialInput.normalEC = normalEC;
materialInput.tangentToEyeMatrix = czm_eastNorthUpToEyeCoordinates(v_positionMC, materialInput.normalEC);
vec3 positionToEyeEC = -v_positionEC;
materialInput.positionToEyeEC = positionToEyeEC;
czm_material material = czm_getMaterial(materialInput);
#ifdef FLAT
gl_FragColor = vec4(material.diffuse + material.emission, material.alpha);
#else
gl_FragColor = czm_phong(normalize(positionToEyeEC), material,czm_lightDirectionEC);
gl_FragColor.a = 0.3;
#endif
}
`;
//水的圖層
export class PrimitiveWaterLayer extends PrimiteveLayer {
private idMapPrimitive = {};
constructor(option: PPrimitiveWaterLayer) {
super(option.name);
this.cesiumObj = new Cesium.PrimitiveCollection();
for (let primitive of option.primitives) {
this.add(primitive);
}
?更多參考?https://xiaozhuanlan.com/topic/6541387092
