Cesium 高度雾

原理大家都知道，但是怎么计算当前像素点的高程呢？相信你也问了gpt很多次，但是确实现在的AI还无法给你想要的答案。

在后处理中计算目前了解到有两种方法，这里就用简单的一种吧。

关键点就是地球半径 废话不多说 直接ctrl c ctrl v吧

记得开启深度检测

/**
 * @description: 高度雾效果
 * @param {*}
 * @return {*}
 */
import * as Cesium from "cesium";

export default class HeightFogEffect {
  constructor(viewer, options) {
    if (!viewer) throw new Error("no viewer object!");
    options = options || {};
    this.viewer = viewer;
    this.height = options.height||100
    this.init();
  }

  init() {
    this.heightFogStage = new Cesium.PostProcessStage({
      name: "czm_heightfog",
      fragmentShader: this.fog(),
      uniforms: {
        alpha: 0.88,
        height: this.height,
        earthRadius: ()=>{
            return Cesium.Cartesian3.magnitude(this.viewer.camera.positionWC) - this.viewer.camera.positionCartographic.height;
        }
      },
    });
    this.viewer.scene.postProcessStages.add(this.heightFogStage);
  }

  destroy() {
    if (!this.viewer || !this.heightFogStage) return;
    this.viewer.scene.postProcessStages.remove(this.heightFogStage);
    Cesium.destroyObject(this.heightFogStage);
  }

  show(visible) {
    this.heightFogStage.enabled = visible;
  }
  changeHeight(value) {
    this.heightFogStage.uniforms.height = value
  }
  changeAlpha(value) {
    this.heightFogStage.uniforms.alpha = value
  }

  fog() {
    return `uniform sampler2D colorTexture;
    uniform sampler2D depthTexture;
    uniform float alpha;
    uniform float height;
    uniform float earthRadius;
    in vec2 v_textureCoordinates;

    float getDepth(in vec4 depth){
      float z_window = czm_unpackDepth(depth);
      z_window = czm_reverseLogDepth(z_window);
      float n_range = czm_depthRange.near;
      float f_range = czm_depthRange.far;
      return (2.0 * z_window - n_range - f_range) / (f_range - n_range);
    }
  
    float getHeight(in vec4 currentDepth){
      float h = 0.0;
      float depth = czm_unpackDepth(currentDepth);
      if (depth == 0.0) {
        h = czm_infinity;
      }
      vec4 eyeCoordinate = czm_windowToEyeCoordinates(gl_FragCoord.xy, depth);
      vec4 positionWC = czm_inverseView * eyeCoordinate;
      vec3 car3 = positionWC.xyz / positionWC.w;
      h = length(car3.xyz) - earthRadius;
      return h;
    }
  
    void main(){
      vec4 color = texture(colorTexture, v_textureCoordinates);
      vec4 currentDepth = texture(depthTexture, v_textureCoordinates);

      float depth = getDepth(currentDepth);
      float pointHeight = getHeight(currentDepth);

      if(depth>=1.0){
         out_FragColor = color;
         return;
      }

      float fog = height/pointHeight-1.;
      out_FragColor = mix(color,vec4(1.,1.,1.,1.),clamp(fog, 0.0, 1.0)*alpha);
    }`
  }
}