ダイナミック変数をJavaScriptシェーダに渡す方法

Question

THREE.SphereGeometryを使用してプリミティブな球を作成しました。私はそれに凹凸のある効果を与えるために、変位シェーダを適用しています。私はマイクから音量のバンプのスケールをアニメートしようとしています。スケールに影響を与えるためにボリューム変数をシェーダーに渡すことができません。ボリューム変数を記録していて、マイクから適切に更新されていることがわかります。

動的変数である：

VAR体積= meter.volume * 1000.0。

function drawLoop(time) { 

rafID = window.requestAnimationFrame(drawLoop); 

var volume = meter.volume * 1000.0; 

//var volume = THREE.UniformsUtils.clone(meter.volume); 

javascript: console.log(typeof(volume)); 


THREE.DisplacementShader = { 

    uniforms: { 

     texture1: { 
      type: "t", 
      value: null 
     }, 
     scale: { 
      type: "f", 
      value: 100 + volume 
     }, 
     volume: { 
      type: "f", 
      value: meter.volume 
     }, 
    }, 

    vertexShader: [ 

     "varying vec2 vUv;", 
     "varying float noise;", 
     "varying vec3 fNormal;", 
     "uniform sampler2D texture1;", 
     "uniform float scale;", 
     "uniform float time;", 
     "varying float volume;", 


     "void main() {", 

     "vUv = uv;", 
     "fNormal = normal;", 

     "vec4 noiseTex = texture2D(texture1, vUv);", 

     "noise = noiseTex.r + time;", 
     //adding the normal scales it outward 
     //(normal scale equals sphere diameter) 
     "vec3 newPosition = position + normal * noise * scale * (volume*100.0);", 

     "gl_Position = projectionMatrix * modelViewMatrix * vec4(newPosition, 1.0);", 

     "}" 

    ].join("\n"), 

    fragmentShader: [ 

     "varying vec2 vUv;", 
     "varying float noise;", 
     "varying vec3 fNormal;", 

     "void main(void) {", 

     // compose the colour using the normals then 
     // whatever is heightened by the noise is lighter 
     "gl_FragColor = vec4(fNormal * noise, 1.);", 

     "}" 

    ].join("\n") 

}; 
} 

Answer 1

あなたが頂点シェーダで

varying float volume; 

を定義しました。代わりに読む必要があります

uniform float volume;