Three.js/Webgl vertex.y 不更新答案

【问题标题】：Three.js/Webgl vertex.y does not updateThree.js/Webgl vertex.y 不更新
【发布时间】：2016-06-28 22:17:49
【问题描述】：

为了学习顶点/片段着色器，我决定通过更新顶点着色器中一个点的 y 位置并使用 Three.js PointCloud 再次将其重置为动画来创建一个简单的雨效果。我让它在屏幕上动画一次，但在重置 y 位置后卡住了。

uniform float size;
uniform float delta;

varying float vOpacity;
varying float vTexture;
void main() {
    vOpacity = opacity;
    vTexture = texture;
    gl_PointSize = 164.0;       
    vec3 p = position;
    vec3 p = position;

    p.y -= delta * 50.0;
    vec4 mvPosition = modelViewMatrix * vec4(1.0 * p, 1.0 );
    vec4 nPos = projectionMatrix * mvPosition;

    if(nPos.y < -200.0){
        nPos.y = 100.0;
    }
    gl_Position = nPos;
}

有什么想法吗？谢谢

【问题讨论】：

创建一个jsfiddle
或post it inline 可以说比小提琴更好

标签： three.js webgl shader vertex-shader

【解决方案1】：

着色器不会永久改变顶点位置

意思是

gl_Position = nPos;

不会传播到几何中的位置属性

着色器只运行在显卡上，无法访问浏览器的内存

您可以将代码更改为：

nPos.y = mod(nPos.y, 300.0) - 200.0;

现在 y 坐标应该随心所欲地改变（从 100 到 -200 然后回到 100）

【讨论】：