Cesium 封装雨效果

考班格

已于 2024-01-28 11:42:33 修改

阅读量302

点赞数 1

CC 4.0 BY-SA版权

分类专栏：菜鸟学习编程之路 Cesium JavaScript 文章标签： cesium javascript 前端

于 2024-01-28 11:38:58 首次发布

本文链接：https://blog.youkuaiyun.com/QQhelphelp/article/details/135893402

本文介绍了如何使用Cesium库在3D视图中创建雨天效果，通过封装PostProcessStage并自定义fragmentshader来模拟雨滴动态。同时，文章还涵盖了如何添加和清除雨天效果的细节。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

/*
 * @Descripttion: 
 * @version: 1.0
 * @Author: tanzheng
 * @Date: 2024-1-22 14:30:42
 */
/**
 * 
 * 封装天气场景
 * 雨天
 */
class Rain {

    constructor(viewer) {
        this.viewer = viewer;
        
        //this.createRain();
      
    }
    //创建雨
    createRain(){
        this.collection = viewer.scene.postProcessStages;
        this._rain = new Cesium.PostProcessStage({
            name: 'czm_rain',
            fragmentShader: this.getRain(),
        });
        this.collection.add(this._rain);

        viewer.scene.skyAtmosphere.hueShift = -0.8;
        viewer.scene.skyAtmosphere.saturationShift = -0.7;
        viewer.scene.skyAtmosphere.brightnessShift = -0.33;
        viewer.scene.fog.density = 0.001;
        viewer.scene.fog.minimumBrightness = 0.8;
    }
    //获取雨特效shader
    getRain() {
        var fs = "uniform sampler2D colorTexture;\n\
                varying vec2 v_textureCoordinates;\n\

最低0.47元/天解锁文章