3

HTML FFTオーディオアナライザは、そのデータをUInt32Array(64)タイプに出力します。

three.jsのドキュメントによると、このデータ型はサポートされていません:https ://github.com/mrdoob/three.js/wiki/Uniforms-types

フレームごとのFFTバッファデータを安価な方法で頂点シェーダーに取り込むにはどうすればよいですか?

非互換性のため、シェーダーをコンパイルできませんでした。

どんな助けでも、提案はありがたいです。

        attributes = {
            customColor:  { type: "c", value: [] },
            tick:      { type: "f", value: 1.0 }
        };

        uniforms = {
            amplitude: { type: "f", value: 5.0 },
            opacity:   { type: "f", value: 0.3 },
            color:     { type: "c", value: new THREE.Color( 0xff0000 ) },
            fftSize:   { type: "i", value: 63 },
            freqData:  { type: "fv1", value: freqByteData }
        };

...

render()ループ内:

        freqByteData = new Uint8Array(analyser.frequencyBinCount);
        analyser.getByteFrequencyData(freqByteData)

        uniforms.freqData = freqByteData;

およびGLSLvシェーダー:

        uniform float freqData[64]; // not working, primitive type conflict
        uniform int fftSize;
        uniform float amplitude;

        attribute vec3 customColor;
        attribute int tick;

        varying vec3 vColor;

        void main() {

            vec3 norm = normalize(position);

            vec3 newPosition = position * freqData[tick % fftSize] + amplitude;

            vColor = customColor;

            gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );

        }
4

1 に答える 1

2

整数配列を渡すことができるように、新しいユニフォームタイプ「iv1」を追加しました。あなたはそれを試すことができます:

https://github.com/alteredq/three.js/commit/4eedc69fa7344f4a512d6ae17427c7e109e0c550

于 2012-07-24T19:17:17.267 に答える