import * as Cesium from 'cesium'
|
|
// 多边形渐变材质
|
let pM = "PolyGradientMaterial"
|
Cesium.Material._materialCache.addMaterial(pM, {
|
strict: true,
|
fabric: {
|
type: pM,
|
uniforms: {
|
color: new Cesium.Color(1.0, 1.0, 0.0, 0.5),
|
diffusePower: 1.6,
|
alphaPower: 1.5,
|
center: new Cesium.Cartesian2(0.5, 0.5),
|
isInner: false,
|
globalAlpha: 1.0,
|
},
|
source: `
|
uniform vec4 color;
|
uniform float diffusePower;
|
uniform float alphaPower;
|
uniform float globalAlpha;
|
uniform vec2 center;
|
uniform bool isInner;
|
|
czm_material czm_getMaterial(czm_materialInput materialInput) {
|
czm_material material = czm_getDefaultMaterial(materialInput);
|
vec2 st = materialInput.st;
|
float alphaMars3D = distance(st, center);
|
|
if(isInner) {
|
material.alpha = (1.0 - (color.a * alphaMars3D * alphaPower)) * globalAlpha;
|
if(material.alpha < 0.0) material.alpha = 0.0;
|
} else {
|
material.alpha = color.a * alphaMars3D * alphaPower * globalAlpha;
|
}
|
|
material.diffuse = color.rgb * diffusePower;
|
return material;
|
}
|
`,
|
},
|
translucent: true,
|
})
|
class MaterialProperty {
|
constructor(options = {}) {
|
this._definitionChanged = new Cesium.Event()
|
|
this._color = undefined
|
this._glowPower = undefined
|
this._taperPower = undefined
|
this._directionColor = undefined
|
this._outlineColor = undefined
|
this._outlineWidth = undefined
|
this._opacity = undefined
|
this._alphaPower = undefined
|
this._speed = undefined
|
|
this.color = options.color || Cesium.Color.fromBytes(0, 255, 255, 255)
|
this.glowPower = .25
|
this.taperPower = 1
|
this.directionColor = options.directionColor || Cesium.Color.fromBytes(255, 255, 255, 255)
|
this.outlineColor = options.outlineColor || Cesium.Color.fromBytes(255, 255, 255, 255)
|
this.outlineWidth = 0
|
this.opacity = options.opacity || 0.5
|
this.alphaPower = options.alphaPower || 1.5
|
this.speed = options.speed || 5
|
}
|
|
get isConstant () {
|
return false
|
}
|
|
get definitionChanged () {
|
return this._definitionChanged
|
}
|
|
getType (time) {
|
return null
|
}
|
|
getValue (time, result) {
|
result = Cesium.defaultValue(result, {})
|
return result
|
}
|
|
equals (other) {
|
return this === other
|
}
|
}
|
class PolyGradientMaterial extends MaterialProperty {
|
constructor(options = {}) {
|
super(options)
|
}
|
|
getType (time) {
|
return pM
|
}
|
|
getValue (time, result) {
|
if (!result) {
|
result = {}
|
}
|
|
result.color = Cesium.Property.getValueOrUndefined(this._color, time)
|
result.globalAlpha = Cesium.Property.getValueOrUndefined(this._opacity, time)
|
result.alphaPower = Cesium.Property.getValueOrUndefined(this._alphaPower, time)
|
return result
|
}
|
|
equals (other) {
|
return (
|
this === other ||
|
(other instanceof PolyGradientMaterial &&
|
Cesium.Property.equals(this._color, other._color) &&
|
Cesium.Property.equals(this._opacity, other._opacity) &&
|
Cesium.Property.equals(this._alphaPower, other._alphaPower))
|
)
|
}
|
}
|
|
Object.defineProperties(PolyGradientMaterial.prototype, {
|
color: Cesium.createPropertyDescriptor('color'),
|
opacity: Cesium.createPropertyDescriptor('opacity'),
|
alphaPower: Cesium.createPropertyDescriptor('alphaPower'),
|
})
|
|
// 轨迹线材质
|
let lT = "LineTrailMaterial"
|
Cesium.Material._materialCache.addMaterial(lT, {
|
fabric: {
|
uniforms: {
|
color: new Cesium.Color(1.0, 1.0, 0.0, 0.7),
|
bgColor: new Cesium.Color(0.0, 1.0, 0.0, 0.0),
|
speed: 5,
|
globalAlpha: 1.0
|
},
|
source: `
|
uniform vec4 bgColor;
|
uniform vec4 color;
|
uniform float speed;
|
uniform float globalAlpha;
|
|
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);
|
vec3 colorMars3D = color.rgb;
|
|
if (st.t > 0.45 && st.t < 0.55) {
|
colorMars3D = vec3(1.0);
|
}
|
|
material.alpha = color.a * 1.5 * smoothstep(0.0, 1.0, fract(st.s - time));
|
material.diffuse = max(colorMars3D.rgb * material.alpha, colorMars3D.rgb);
|
|
if (material.alpha < bgColor.a) {
|
material.alpha = bgColor.a;
|
material.diffuse = bgColor.rgb;
|
}
|
|
material.alpha = material.alpha * globalAlpha;
|
return material;
|
}
|
`
|
},
|
translucent: true
|
})
|
class LineTrailMaterial extends MaterialProperty {
|
constructor(options = {}) {
|
super(options)
|
}
|
|
getType (time) {
|
return lT
|
}
|
|
getValue (time, result) {
|
if (!result) {
|
result = {}
|
}
|
|
result.color = Cesium.Property.getValueOrUndefined(this._color, time)
|
result.globalAlpha = Cesium.Property.getValueOrUndefined(this._opacity, time)
|
result.speed = Cesium.Property.getValueOrUndefined(this._speed, time)
|
return result
|
}
|
|
equals (other) {
|
return (
|
this === other ||
|
(other instanceof LineTrailMaterial &&
|
Cesium.Property.equals(this._color, other._color) &&
|
Cesium.Property.equals(this._opacity, other._opacity) &&
|
Cesium.Property.equals(this._speed, other._speed))
|
)
|
}
|
}
|
|
Object.defineProperties(LineTrailMaterial.prototype, {
|
color: Cesium.createPropertyDescriptor('color'),
|
opacity: Cesium.createPropertyDescriptor('opacity'),
|
speed: Cesium.createPropertyDescriptor('speed'),
|
})
|
|
|
let arrowLineMaterialType = "ArrowLineMaterial"
|
Cesium.Material._materialCache.addMaterial(arrowLineMaterialType, {
|
fabric: {
|
type: arrowLineMaterialType,
|
uniforms: {
|
color: new Cesium.Color(0, 1, 1, 1),
|
directionColor: new Cesium.Color(1, 1, 1, 1),
|
outlineColor: new Cesium.Color(1, 1, 1, 1),
|
outlineWidth: 0,
|
speed: 0, // Added speed uniform with default 0 (no animation)
|
},
|
source: `
|
#ifdef GL_OES_standard_derivatives
|
#extension GL_OES_standard_derivatives : enable
|
#endif
|
|
uniform vec4 color;
|
uniform vec4 directionColor;
|
uniform vec4 outlineColor;
|
uniform float outlineWidth;
|
uniform float speed; // Added speed uniform
|
|
in float v_width;
|
in float v_polylineAngle;
|
|
const float fragLength = 100.0;
|
const float startPosition = 0.45;
|
const float endPosition = 0.55;
|
|
mat2 rotate(float rad) {
|
float c = cos(rad);
|
float s = sin(rad);
|
return mat2(c, s, -s, c);
|
}
|
|
float getPointOnLine(vec2 p0, vec2 p1, float x) {
|
float slope = (p0.y - p1.y) / (p0.x - p1.x);
|
return slope * (x - p0.x) + p0.y;
|
}
|
|
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 halfInteriorWidth = 0.5 * (v_width - outlineWidth) / v_width;
|
float b = step(0.5 - halfInteriorWidth, st.t);
|
b *= 1.0 - step(0.5 + halfInteriorWidth, st.t);
|
|
float d1 = abs(st.t - (0.5 - halfInteriorWidth));
|
float d2 = abs(st.t - (0.5 + halfInteriorWidth));
|
float dist = min(d1, d2);
|
|
vec4 currentColor = mix(outlineColor, color, b);
|
vec4 outColor = czm_antialias(outlineColor, color, currentColor, dist);
|
outColor = czm_gammaCorrect(outColor);
|
|
vec2 pos = rotate(v_polylineAngle) * gl_FragCoord.xy;
|
|
// Modified to include animation based on speed and time
|
float animationOffset = speed * time;
|
float maskS = fract((pos.x / (fragLength * czm_pixelRatio)) - animationOffset);
|
|
float maskT = st.t;
|
bool isDirection = (maskS > startPosition) && (maskS <= endPosition);
|
|
vec4 fragColor;
|
if (isDirection) {
|
float arrowWidth = (endPosition - startPosition) / 2.0;
|
float midS = startPosition + arrowWidth;
|
|
float t = 1.0;
|
if (maskS < midS) {
|
vec2 center = vec2(midS, 0.5);
|
float ptOnUpperLine = getPointOnLine(vec2(startPosition, 1.0), center, maskS);
|
float ptOnLowerLine = getPointOnLine(vec2(startPosition, 0.0), center, maskS);
|
|
t *= 1.0 - step(ptOnUpperLine, maskT);
|
t *= step(ptOnLowerLine, maskT);
|
t = 1.0 - t;
|
} else {
|
vec2 center = vec2(endPosition, 0.5);
|
float ptOnUpperLine = getPointOnLine(vec2(midS, 1.0), center, maskS);
|
float ptOnLowerLine = getPointOnLine(vec2(midS, 0.0), center, maskS);
|
|
t *= 1.0 - step(ptOnUpperLine, maskT);
|
t *= step(ptOnLowerLine, maskT);
|
}
|
|
vec4 outsideColor = outColor;
|
vec4 currentColor = mix(outsideColor, directionColor, clamp(t, 0.0, 1.0));
|
fragColor = currentColor;
|
} else {
|
fragColor = outColor;
|
}
|
|
fragColor = czm_gammaCorrect(fragColor);
|
material.diffuse = fragColor.rgb;
|
material.alpha = fragColor.a;
|
return material;
|
}`
|
},
|
translucent: true
|
})
|
|
class ArrowLineMaterialProperty extends MaterialProperty {
|
constructor(options = {}) {
|
super(options)
|
}
|
|
getType (time) {
|
return arrowLineMaterialType
|
}
|
|
getType (time) {
|
return arrowLineMaterialType
|
}
|
|
getValue (time, result) {
|
if (!result) {
|
result = {}
|
}
|
|
result.color = Cesium.Property.getValueOrUndefined(this._color, time)
|
result.directionColor = Cesium.Property.getValueOrUndefined(this._directionColor, time)
|
result.outlineColor = Cesium.Property.getValueOrUndefined(this._outlineColor, time)
|
result.outlineWidth = Cesium.Property.getValueOrUndefined(this._outlineWidth, time)
|
result.speed = Cesium.Property.getValueOrUndefined(this._speed, time)
|
|
return result
|
}
|
|
equals (other) {
|
return (
|
this === other ||
|
(other instanceof ArrowLineMaterialProperty &&
|
Cesium.Property.equals(this._color, other._color) &&
|
Cesium.Property.equals(this._directionColor, other._directionColor) &&
|
Cesium.Property.equals(this._outlineColor, other._outlineColor) &&
|
Cesium.Property.equals(this._outlineWidth, other._outlineWidth) &&
|
Cesium.Property.equals(this._speed, other._speed))
|
)
|
}
|
}
|
|
Object.defineProperties(ArrowLineMaterialProperty.prototype, {
|
color: Cesium.createPropertyDescriptor('color'),
|
directionColor: Cesium.createPropertyDescriptor('directionColor'),
|
outlineColor: Cesium.createPropertyDescriptor('outlineColor'),
|
outlineWidth: Cesium.createPropertyDescriptor('outlineWidth'),
|
speed: Cesium.createPropertyDescriptor('speed')
|
})
|
|
|
// 轨迹线材质
|
let pLG = "PolylineGlow"
|
Cesium.Material._materialCache.addMaterial(pLG, {
|
fabric: {
|
uniforms: {
|
color: new Cesium.Color(0, .5, 1, 1),
|
glowPower: .25,
|
taperPower: 1
|
},
|
|
source: ` uniform vec4 color;
|
uniform float glowPower;
|
uniform float taperPower;
|
|
czm_material czm_getMaterial(czm_materialInput materialInput)
|
{
|
czm_material material = czm_getDefaultMaterial(materialInput);
|
|
vec2 st = materialInput.st;
|
float glow = glowPower / abs(st.t - 0.5) - (glowPower / 0.5);
|
|
if (taperPower <= 0.99999) {
|
glow *= min(1.0, taperPower / (0.5 - st.s * 0.5) - (taperPower / 0.5));
|
}
|
|
vec4 fragColor;
|
fragColor.rgb = max(vec3(glow - 1.0 + color.rgb), color.rgb);
|
fragColor.a = clamp(0.0, 1.0, glow) * color.a;
|
fragColor = czm_gammaCorrect(fragColor);
|
|
material.emission = fragColor.rgb;
|
material.alpha = fragColor.a;
|
|
return material;
|
}
|
`
|
},
|
translucent: true
|
})
|
class PolylineGlowMaterial extends MaterialProperty {
|
constructor(options = {}) {
|
super(options)
|
}
|
|
getType (time) {
|
return pLG
|
}
|
|
getValue (time, result) {
|
if (!result) {
|
result = {}
|
}
|
|
result.color = Cesium.Property.getValueOrUndefined(this._color, time)
|
result.glowPower = Cesium.Property.getValueOrUndefined(this._glowPower, time)
|
result.taperPower = Cesium.Property.getValueOrUndefined(this._taperPower, time)
|
return result
|
}
|
|
equals (other) {
|
return (
|
this === other ||
|
(other instanceof LineTrailMaterial &&
|
Cesium.Property.equals(this._color, other._color) &&
|
Cesium.Property.equals(this._glowPower, other._glowPower) &&
|
Cesium.Property.equals(this._taperPower, other._taperPower))
|
)
|
}
|
}
|
|
Object.defineProperties(PolylineGlowMaterial.prototype, {
|
color: Cesium.createPropertyDescriptor('color'),
|
glowPower: Cesium.createPropertyDescriptor('glowPower'),
|
taperPower: Cesium.createPropertyDescriptor('taperPower'),
|
})
|
|
|
export {
|
PolyGradientMaterial,
|
LineTrailMaterial,
|
ArrowLineMaterialProperty,
|
PolylineGlowMaterial
|
}
|
