Cesium Snow/Rain

    
    
    
    
    
    
    



    snow
    rain
    stop




    // var GoogleMap = ImageryProviderWebExtendTool.createGoogleMapsByUrl(Cesium, { url: "http://mt1.google.cn/vt/lyrs=s&hl=zh-CN&x={x}&y={y}&z={z}" });
    var viewer = new Cesium.Viewer('cesiumContainer', {
        // imageryProvider: GoogleMap,
        contextOptions: {
            webgl: {
                alpha: true,
                depth: false,
                stencil: true,
                antialias: true,
                premultipliedAlpha: true,
                preserveDrawingBuffer: true,
                failIfMajorPerformanceCaveat: true
            },
            allowTextureFilterAnisotropic: true
        },
        creditContainer: "creditContainer",
        selectionIndicator: false,
        animation: false,
        baseLayerPicker: false,
        geocoder: false,
        timeline: false,
        sceneModePicker: true,
        navigationHelpButton: false,
        infoBox: false,
        fullscreenButton: true
    });

    var lat = 42.006;
    var lon = 128.055;
    // 
    viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
    // homebutton 
    Cesium.Camera.DEFAULT_VIEW_RECTANGLE =
        Cesium.Rectangle.fromDegrees(lon - 1, lat - 1, lon + 1, lat + 1);//Rectangle(west, south, east, north)
    // 
    viewer.camera.setView({
        destination: Cesium.Cartesian3.fromDegrees(lon, lat, 300000)
    });
    //   
    function FS_Snow() {
        return "uniform sampler2D colorTexture;
\
    varying vec2 v_textureCoordinates;
\

\
    float snow(vec2 uv,float scale)
\
    {
\
        float time = czm_frameNumber / 60.0;
\
        float w=smoothstep(1.,0.,-uv.y*(scale/10.));if(w<.1)return 0.;
\
        uv+=time/scale;uv.y+=time*2./scale;uv.x+=sin(uv.y+time*.5)/scale;
\
        uv*=scale;vec2 s=floor(uv),f=fract(uv),p;float k=3.,d;
\
        p=.5+.35*sin(11.*fract(sin((s+p+scale)*mat2(7,3,6,5))*5.))-f;d=length(p);k=min(d,k);
\
        k=smoothstep(0.,k,sin(f.x+f.y)*0.01);
\
        return k*w;
\
    }
\

\
    void main(void){
\
        vec2 resolution = czm_viewport.zw;
\
        vec2 uv=(gl_FragCoord.xy*2.-resolution.xy)/min(resolution.x,resolution.y);
\
        vec3 finalColor=vec3(0);
\
        float c = 0.0;
\
        c+=snow(uv,30.)*.0;
\
        c+=snow(uv,20.)*.0;
\
        c+=snow(uv,15.)*.0;
\
        c+=snow(uv,10.);
\
        c+=snow(uv,8.);
\
    c+=snow(uv,6.);
\
        c+=snow(uv,5.);
\
        finalColor=(vec3(c)); 
\
        gl_FragColor = mix(texture2D(colorTexture, v_textureCoordinates), vec4(finalColor,1), 0.5); 
\

\
    }
\
";
    }
    function FS_Rain() {
        return "uniform sampler2D colorTexture;
\
				varying vec2 v_textureCoordinates;
\
			
\
				float hash(float x){
\
					return fract(sin(x*133.3)*13.13);
\
			}
\
			
\
			void main(void){
\
			
\
				float time = czm_frameNumber / 60.0;
\
			vec2 resolution = czm_viewport.zw;
\
			
\
			vec2 uv=(gl_FragCoord.xy*2.-resolution.xy)/min(resolution.x,resolution.y);
\
			vec3 c=vec3(.6,.7,.8);
\
			
\
			float a=-.4;
\
			float si=sin(a),co=cos(a);
\
			uv*=mat2(co,-si,si,co);
\
			uv*=length(uv+vec2(0,4.9))*.3+1.;
\
			
\
			float v=1.-sin(hash(floor(uv.x*100.))*2.);
\
			float b=clamp(abs(sin(20.*time*v+uv.y*(5./(2.+v))))-.95,0.,1.)*20.;
\
			c*=v*b; 
\
			
\
			gl_FragColor = mix(texture2D(colorTexture, v_textureCoordinates), vec4(c,1), 0.5);  
\
			}
\
";
    }
    var snow;
    var rain;
    function showSnow() {
        rain?rain.destroy():'';
        snow?snow.destroy():'';
        var collection = viewer.scene.postProcessStages;
        var fs_snow = FS_Snow();
        snow = new Cesium.PostProcessStage({
            name: 'czm_snow',
            fragmentShader: fs_snow
        });
        collection.add(snow);
        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;
    }

    function showRain() {
        snow?snow.destroy():'';
        rain?rain.destroy():'';
        var collection = viewer.scene.postProcessStages;
        var fs_rain = FS_Rain();
        rain = new Cesium.PostProcessStage({
            name: 'czm_rain',
            fragmentShader: fs_rain
        });
        collection.add(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;
    }
    function stopTool(){
        snow?snow.destroy():'';
        rain?rain.destroy():'';
    }
    var tooBarArr=document.getElementById("toolbar").children;
    for(var i=0;i<tooBarArr.length;i++){
        tooBarArr[i].classList.remove('cesium-button');
        tooBarArr[i].style.marginRight='5px';
    }

    Sandcastle.finishedLoading();




    var ImageryProviderWebExtendTool = (
        function () {
            function _() { }

            _.createGoogleMapsByUrl = function (Cesium, options) {
                options = Cesium.defaultValue(options, {});

                var templateUrl = Cesium.defaultValue(options.url, 'http://mt1.google.cn/vt/lyrs=s&hl=zh-CN&x={x}&y={y}&z={z}');

                var trailingSlashRegex = /\/$/;
                var defaultCredit = new Cesium.Credit('Google Maps');

                var tilingScheme = new Cesium.WebMercatorTilingScheme({ ellipsoid: options.ellipsoid });

                var tileWidth = 256;
                var tileHeight = 256;

                var minimumLevel = Cesium.defaultValue(options.minimumLevel, 0);
                var maximumLevel = Cesium.defaultValue(options.minimumLevel, 17);

                var rectangle = Cesium.defaultValue(options.rectangle, tilingScheme.rectangle);

                // Check the number of tiles at the minimum level.  If it's more than four,
                // throw an exception, because starting at the higher minimum
                // level will cause too many tiles to be downloaded and rendered.
                var swTile = tilingScheme.positionToTileXY(Cesium.Rectangle.southwest(rectangle), minimumLevel);
                var neTile = tilingScheme.positionToTileXY(Cesium.Rectangle.northeast(rectangle), minimumLevel);
                var tileCount = (Math.abs(neTile.x - swTile.x) + 1) * (Math.abs(neTile.y - swTile.y) + 1);
                //>>includeStart('debug', pragmas.debug);
                if (tileCount > 4) {
                    throw new Cesium.DeveloperError('The rectangle and minimumLevel indicate that there are ' + tileCount + ' tiles at the minimum level. Imagery providers with more than four tiles at the minimum level are not supported.');
                }
                //>>includeEnd('debug');

                var credit = Cesium.defaultValue(options.credit, defaultCredit);
                if (typeof credit === 'string') {
                    credit = new Cesium.Credit(credit);
                }

                return new Cesium.UrlTemplateImageryProvider({
                    url: templateUrl,
                    proxy: options.proxy,
                    credit: credit,
                    tilingScheme: tilingScheme,
                    tileWidth: tileWidth,
                    tileHeight: tileHeight,
                    minimumLevel: minimumLevel,
                    maximumLevel: maximumLevel,
                    rectangle: rectangle
                });
            }
            return _;
        }
    )();