Javascript 未捕获类型错误：使用Three.js的WebGL中的类型错误

我正在使用WebGL和Three.js构建一个小型音乐可视化工具，使用ThreeAudio.js库将音频转换为纹理，并传递到着色器中。尽管目前一切正常，但我发现以下错误，我想找出原因：

“未捕获类型错误：类型错误”

然后可以追溯到我的动画函数、渲染函数、three.js渲染函数、名为“l”的函数、renderBuffer函数和“z”函数

我的动画功能如下所示：

function animate() {
 requestAnimationFrame( animate );
 audioTextures.update();

 stats.update();
 render();
}

function render(){
 renderer.render( scene, camera );
}

audioSource = (new       ThreeAudio.Source()).load('https://api.soundcloud.com/tracks/125098652/stream?client_id=MYCLIENTID').play();
audioTextures = new ThreeAudio.Textures(renderer, audioSource);
audioMaterial = new ThreeAudio.Material(audioTextures, vertexShader, fragmentShader);
audioMesh = new THREE.Mesh(geometry, audioMaterial);
scene.add(audioMesh);

我的渲染功能如下所示：

function animate() {
 requestAnimationFrame( animate );
 audioTextures.update();

 stats.update();
 render();
}

function render(){
 renderer.render( scene, camera );
}

audioSource = (new       ThreeAudio.Source()).load('https://api.soundcloud.com/tracks/125098652/stream?client_id=MYCLIENTID').play();
audioTextures = new ThreeAudio.Textures(renderer, audioSource);
audioMaterial = new ThreeAudio.Material(audioTextures, vertexShader, fragmentShader);
audioMesh = new THREE.Mesh(geometry, audioMaterial);
scene.add(audioMesh);

我相信这是我正在创建的网格的问题，因为当我注释掉代码以将其添加到场景中时，错误就会消失

我拥有的动画球体的代码如下所示：

function animate() {
 requestAnimationFrame( animate );
 audioTextures.update();

 stats.update();
 render();
}

function render(){
 renderer.render( scene, camera );
}

audioSource = (new       ThreeAudio.Source()).load('https://api.soundcloud.com/tracks/125098652/stream?client_id=MYCLIENTID').play();
audioTextures = new ThreeAudio.Textures(renderer, audioSource);
audioMaterial = new ThreeAudio.Material(audioTextures, vertexShader, fragmentShader);
audioMesh = new THREE.Mesh(geometry, audioMaterial);
scene.add(audioMesh);

可在此处找到ThreeAudio github： 请让我知道，如果这将有助于张贴我的着色器以及

---

有人知道我应该如何开始解决这个错误吗？有人见过它以这种方式出现吗？请告诉我。

好的，我最后自己回答了这个问题。如果有人在寻找类似问题的答案时偶然发现了这一点，我就是这样解决的：

我意识到在加载音频源之前调用了animate函数，这意味着音频纹理中没有任何数据。我使用的库（ThreeAudio）似乎处理了这个异常，在我有限的经验中，数据进入着色器的问题往往会破坏一切

解决方案是在加载音频源后将animate（）调用移动到回调函数中。我的代码如下所示：

audioSource = (new ThreeAudio.Source()).load('https://api.soundcloud.com/tracks/125098652/stream?client_id=MYCLIENTID', function(){
clock = new THREE.Clock();
audioSource.play();
audioTextures = new ThreeAudio.Textures(renderer, audioSource);
audioMaterial = new ThreeAudio.Material(audioTextures, vertexShader, fragmentShader);
audioMaterial.uniforms['volume'] = {type: 'f', value: 0};
audioMaterial.uniforms['volume2'] = {type: 'f', value: 0};
audioMaterial.uniforms['volume3'] = {type: 'f', value: 0};

// My custom cube geometry
var geometry = CubeGeometry(audioTextures, 500, 500, 500, 500, 500);

audioMesh = new THREE.Mesh(geometry, audioMaterial);
audioMesh.position.y = -200;
scene.add(audioMesh);

animate();
});