Javascript GLSL数组未通过数据

Javascript GLSL数组未通过数据,javascript,three.js,glsl,shader,web-audio-api,Javascript,Three.js,Glsl,Shader,Web Audio Api,我目前正在研究GLSL着色器,它通过从音频中提取的256长度整数数组。我正在使用Javascript和Three.js进行实际渲染。我在脚本的后面通过首先定义制服列表来获取音频对象: uniforms1 = { time: { type: "f", value: 1.0 }, resolution: { type: "v2", value: new THREE.Vector2() }, mouse: { type: "v2", value: new THREE.Vecto

我目前正在研究GLSL着色器,它通过从音频中提取的256长度整数数组。我正在使用Javascript和Three.js进行实际渲染。我在脚本的后面通过首先定义制服列表来获取音频对象:

uniforms1 = {
    time: { type: "f", value: 1.0 },
    resolution: { type: "v2", value: new THREE.Vector2() },
    mouse: { type: "v2", value: new THREE.Vector2() },
    audio:{ type: "int", value: new Array(256) },
};
在每个渲染帧中,我调用以下命令:

freqByteData = new Uint8Array(audio.analyser.frequencyBinCount); 
audio.analyser.getByteFrequencyData(freqByteData);
uniforms1.audio.value = freqByteData;
其中audio.analyzer是web音频分析器节点。代码的这一部分工作正常,我已经验证了uniforms1.audio是一个使用Analyzer数据填充的UINT8数组。我遇到的问题是,我似乎无法将这些数据拉入片段着色器本身。我对GLSL非常陌生,所以我假设这是一个基本问题,但我花了一些时间四处寻找解决方案,似乎找不到。下面是片段着色器代码:

<script id="fragment_shader2" type="x-shader/x-fragment">

        uniform vec2 resolution;
        uniform float time;
        uniform vec2 mouse;
        uniform int audio[256];

        #define N 100
        void main( void ) {

            vec2 v = (gl_FragCoord.xy - resolution) / min(resolution.y,resolution.x) *0.5;

            float pi2 = 3.1415926535 * 2.0;
            float C = cos(mouse.x * pi2);
            float S = sin(mouse.y * pi2);
            //C = v.x;
            //S = v.y;

            float a = float(audio[20]/100);
            for ( int i = 0; i < N; i++ ){
                float x = v.x*v.x - v.y*v.y + C;
                float y = v.y * v.x + v.x * v.y+ S;
                v = vec2(x,y);
            }

            float col = v.x*v.x + v.y*v.y;

            gl_FragColor = vec4( a, sin(col*3.0), (cos(col)+sin(col))/2.0, 1.0 );

        }
    </script>

均匀vec2分辨率;
均匀浮动时间;
均匀vec2小鼠;
统一整数音频[256];
#定义N 100
真空总管(真空){
vec2v=(gl_FragCoord.xy-分辨率)/min(分辨率y,分辨率x)*0.5;
浮动pi2=3.1415926535*2.0;
浮点C=cos(鼠标x*pi2);
浮动S=sin(鼠标y*pi2);
//C=v.x;
//S=v.y;
浮点a=浮点(音频[20]/100);
对于(int i=0;i
这创建了一个典型的“Julia Set”资源管理器,只有蓝色和绿色,这在没有音频播放时是有意义的,但是,我希望当音频开始播放时,浮动“a”将为非零,因此会在集合中引入红色。也就是说,在整个音频中,没有红色可见(尽管我也检查了以确保音频[20]确实为非零)

再说一次,我是GLSL的新手,所以如果问题显而易见,我很抱歉,但我们非常感谢您的帮助

提前谢谢!
艾萨克

Try
float a=float(音频[20])/100.0;
type
int
不存在制服,请参阅。使用
iv1
instead@WestLangley这很有效,没有给我任何错误!但是它似乎仍然没有给我任何东西,除了最后一行中的“0”,我在FragColor中调用“a”vec4@WestLangley我在一行中添加了if(a==0.0){a=1.0;}它总是返回a=1.0;这在音乐开始之前是有意义的,但是一旦音乐开始,a就不应该再==0.0。这仅仅是我对制服的理解有问题吗?我希望GPU需要一个32位整数的数组。你似乎在传递一个8位无符号整数的数组。试着让它以一个硬的方式工作有线音频数据阵列第一。