下雨了

        今天下大雨了,寝室外面在打雷,雨点扑簌簌地打在树叶上,我突然觉得我好像只是需要一个栖身之所。每个人都在找那个栖身之所。那种感觉就像回到小时候,无忧无虑。下雨天,躲在灯光饱满的室内,有一个大屏幕,可以写写网络日记,可以记录心情,真是挺好的。还可以写写程序,多棒。哈哈,暴露了自己程序员的身份啊。

以下是不同实现下雨效果的代码: #### GLSL 代码实现下雨效果 ```glsl 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); // 将雨和三维场景融合 } ``` 上述代码是一个在 GLSL 中实现下雨效果的代码,它通过一系列的数学计算模拟雨滴的下落效果,并将其与输入的场景渲染照片进行融合 [^1]。 #### Vue + Cesium 实现下雨效果的着色代码 ```javascript 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.))*100.); float b = clamp(abs(sin(15.*time*v + uv.y*(10./(2.+v)))) - .95, 0., 1.)*4.; c *= v*b; gl_FragColor = mix(texture2D(colorTexture, v_textureCoordinates), vec4(c,1), 0.5); } `; } ``` 此代码是在 Vue 和 Cesium 环境中实现下雨效果的着色器代码,定义了一个函数返回下雨效果的 GLSL 代码字符串 [^2]。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值