three.js：頂点シェーダの属性値を変更してバッファに渡す

Question

シェーダの属性の値を変更して、これを次のフレームレンダリングのためにバッファに反映させることはできますか？

たとえば、頂点シェーダの頂点の位置を変更して、この新しい値を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]; 
    } 
} 

Answer 1

私はこれを行う方法を見つけました。

FBOシミュレーションと呼ばれる概念を使用して、シミュレーションシェーダを作成しました。シミュレーションシェーダはglslシェーダで計算を計算し、結果を画面に表示するのではなく、テクスチャに書き込みます。次に、「実際の」シェーダのテクスチャから読み込んで、結果を画面に書きました。これにより、異なる出力テクスチャを比較して、フレーム間のパーティクルの速度とサイズの違いを解決することもできました。

あなたはそれがここで説明されている詳細を読むことができます：https://github.com/mrdoob/three.js/issues/1183

例： http://barradeau.com/blog/?p=621