Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/387.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 三个js-用于后处理的基本着色器_Javascript_3d_Three.js_Glsl_Webgl - Fatal编程技术网

Javascript 三个js-用于后处理的基本着色器

Javascript 三个js-用于后处理的基本着色器,javascript,3d,three.js,glsl,webgl,Javascript,3d,Three.js,Glsl,Webgl,我一直在尝试编写一个简单的着色器来添加噪声。但我无法使用以下设置获取uv坐标 片段着色器: uniform float seed; uniform sampler2D pass; varying vec2 vUv; void main (){ //noise vec2 pos = gl_FragCoord.xy; pos.x *= seed; pos.y *= seed; float lum=fract(sin(dot(pos ,vec2(12.989

我一直在尝试编写一个简单的着色器来添加噪声。但我无法使用以下设置获取uv坐标

片段着色器:

uniform float seed;
uniform sampler2D pass;

varying vec2 vUv;

void main (){
    //noise
    vec2 pos = gl_FragCoord.xy;
    pos.x *= seed;
    pos.y *= seed;
    float lum=fract(sin(dot(pos ,vec2(12.9898,78.233))) * 434658.5453116487577816842168767168087910388737310);

    vec4 tx = texture2D(pass, vUv);

    gl_FragColor = vec4(tx.r*lum,tx.g*lum,tx.b*lum,1.0);

}
顶点着色器:

varying vec2 vUv;

void main (){
    vUv = uv;
    gl_Position = projectionMatrix * modelViewMatrix * vec4(position,1.0);
}
渲染:

OBJECT.material = OBJECT.mat.flat; // THREE MeshPhongMaterial ({color: 0xE40D59,shading:THREE.FlatShading});

RENDERER.render(SCENE,CAMERA,BEAUTY_PASS,false);

OBJECT.material = OBJECT.mat.noise; // THREE ShaderMaterial

RENDERER.render(SCENE,CAMERA);
我得到以下错误:

错误:WebGL:抽屉元素:绑定顶点属性缓冲区没有 绑定元素数组中给定索引的足够大小@

我做了一些测试,我可以通过为所有像素选择相同的坐标来运行它

vec4 tx = texture2D(pass, vec2(0.5,0.5));
它以红色杂色显示我的对象,但是如果我删除第一个渲染过程(
RENDERER.render(场景、摄影机、美景过程、假)
),vUv变量的效果非常好


为什么在第二次渲染时无法获取uv坐标?根据几个例子,我应该能够使用相同的场景和摄影机渲染它,就像在这个

中一样,没有初始纹理,几何体将没有必要的WebGL UV缓冲区烘焙

有几种解决方案,但最简单的可能是确保网格的第一次渲染具有纹理。一个简单的白色就可以了


three.js r.58

谢谢!在第一次渲染中使用白色纹理,实际上可以解决问题并保持uv坐标。然而现在我的二十面体是一个土豆。你认为这是因为原始的uv贴图吗?这可能是你的照明模型,与这个问题无关。你能为新发行的那一期写一篇新文章吗