如何将噪声着色器放入我的平面几何体中
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何将噪声着色器放入我的平面几何体中相关的知识,希望对你有一定的参考价值。
以下链接是我的笔:
https://codepen.io/johnhckuo/pen/RxrXxX
这是片段着色器中的代码:
void main() {
vec2 st = gl_FragCoord.xy/u_resolution.xy;
vec3 color = vec3(0.0);
vec3 worldtoEye = eye - worldPosition;
vec3 eyeDirection = normalize(worldtoEye);
vec3 pos = vec3(st.x*5.0, st.y*5.0, u_time*0.5);
color = vec3(fbm(pos) + 1.0);
//color = vec3(noise(pos)*0.5 + 1.0);
vec3 sunLight = vec3(1., 1., 1.);
color *= (diffuseLight(sunLight) + specularLight(eyeDirection));
vec3 oceanBlue = vec3(0.109, 0.419, 0.627);
gl_FragColor = vec4(oceanBlue * color, 1.0);
}
这是平面几何的代码:
var plane_geometry = new THREE.PlaneBufferGeometry( 2000, 2000, 32 );
var customMaterial = new THREE.ShaderMaterial(
{
uniforms: uniforms,
vertexShader: document.getElementById( 'vertexShader' ).textContent,
fragmentShader: document.getElementById( 'fragmentShader' ).textContent
}
);
customMaterial.side = THREE.DoubleSide;
var surface = new THREE.Mesh( plane_geometry, customMaterial );
surface.position.set(0,0,0);
scene.add( surface );
我创建了一个着色器并试图将它应用到我的飞机上。
但是每当我放大/缩小时,着色器就会被固定到屏幕而不会相应地放大/缩小。
任何建议表示赞赏!
答案
改变这一行:
vec2 st = gl_FragCoord.xy/u_resolution.xy;
至
vec2 st = uVu.xy* 2.0;
并摆弄2.0
(决议)
在ShaderFrog上测试vert + frag着色器也很容易,如:https://shaderfrog.com/app/view/1997
以上是关于如何将噪声着色器放入我的平面几何体中的主要内容,如果未能解决你的问题,请参考以下文章