three.js：更改顶点着色器中的属性值并传递到缓冲区

是否可以更改着色器中属性的值，并将其反映在下一帧渲染的缓冲区中

例如，在顶点着色器中更改顶点的位置，并将此新值发送回javascript缓冲区对象

代码示例如下：

attribute vec3 newPosition;
attribute vec3 divideVal;

void main() {
    vec3 difference = newPosition - position;

    velocity = difference / divideVal;

    position += velocity;

    vec4 mvPosition = modelViewMatrix * vec4(position, 1.0);

    gl_PointSize = size * (sizeMultipler / -mvPosition.z);

    gl_Position = projectionMatrix * mvPosition;
}

编辑：

现在我是在JS本身中这样做的，但是我知道如果我将尽可能多的计算移到着色器中，它会更快吗？这是我现在的JS:

const positions = this.geometry.attributes.position.array;
const newPositions = this.geometry.attributes.newPosition.array;

for (let i = 0, i3 = 0; i < this.numParticles; i++, i3 += 3) {
    const velocity = [newPositions[i3] - positions[i3], newPositions[i3 + 1] - positions[i3 + 1], newPositions[i3 + 2] - positions[i3 + 2]];

    if (velocity[0] || velocity[1] || velocity[2]) {
        const minReset = 1;

        velocity[0] = velocity[0] / 60;
        velocity[1] = velocity[1] / 60;
        velocity[2] = velocity[2] / 60;

        positions[i3] = positions[i3] + velocity[0];
        positions[i3 + 1] = positions[i3 + 1] + velocity[1];
        positions[i3 + 2] = positions[i3 + 2] + velocity[2];
    }
}

const positions=this.geometry.attributes.position.array；
const newPositions=this.geometry.attributes.newPosition.array；
for（设i=0，i3=0；i

我发现了如何做到这一点

使用名为FBO Simulation的概念，我创建了一个模拟着色器，它在其glsl着色器中计算计算，然后将结果写入纹理，而不是显示在屏幕上。然后我在“真实”着色器中读取该纹理，并将结果写入屏幕。这也让我能够比较不同的输出纹理，计算出帧之间粒子的速度和大小差异

您可以在此处阅读更多有关讨论的内容：

例如：

---

是的，但这与glsl无关。在three.js级别，它要抽象得多。您可以通过更新

几何体

或

缓冲几何体

，共享更多代码来实现这一点？您可以使用webgl2变换反馈（这里是一个非常简单的示例：），但我不确定如何将其与three.js连接起来，可能使用

object.onBeforeRender

。