Cesium 自定义Material 系列 （七）

• 对于水波纹墙效果 我们先定义一下他的interface, 方便使用的人知道他的调用参数

• export interface PMaterialWallRipple{
• color?: any,
• speed?: number,
• count: number,
• }

• 对于水波纹墙我们叫 MaterialWallRipple

```javascript

import { MaterialProperty } from "./MaterialProperty";

const defaultOption: PMaterialWallRipple = {
color: new Cesium.Color(0.0, 0, 1.0, 0.5),
speed: 1,
count: 5,
}
//水波纹(墙)
export class MaterialWallRipple extends MaterialProperty{
protected _getType(option: any): string {
return "MaterialWallRipple";
}
constructor(option=defaultOption) {
super(MaterialWallRipple.prototype, defaultOption, option);
}
protected getSource(option: any): string {
return `
uniform vec4 color;
uniform float speed;
uniform float count;
czm_material czm_getMaterial(czm_materialInput materialInput)
{
czm_material material = czm_getDefaultMaterial(materialInput);
vec2 st = materialInput.st;
float time = fract(czm_frameNumber * speed / 1000.0);
float sin = sin((st.t - time) * 10.0 * count);
float high = 0.92;
float medium = 0.4;
vec4 temp= vec4(0.);
if(sin > high ){
temp = vec4(mix(vec3(.8, 1., 1.), color.rgb, (1. - sin) / (1. - high)), 1.);
}else if(sin > medium) {

更多参考 https://xiaozhuanlan.com/topic/2497083615