我正在为一个网站使用glfx.js图像效果库,我有一个画布,而不是渲染一个不断被新图像替换的图像,然后对其应用过滤器。
问题是在运行几分钟后(在加载了大约 2300 个不同的纹理之后)WebGL 会抛出这个错误:
WebGL: INVALID_VALUE: texImage2D: bad image data
我把它缩小到这个功能:
Texture.prototype.loadContentsOf = function(element) {
this.width = element.width || element.videoWidth;
this.height = element.height || element.videoHeight;
gl.bindTexture(gl.TEXTURE_2D, this.id);
gl.texImage2D(gl.TEXTURE_2D, 0, this.format, this.format, this.type, element);
};
在第 2,300 次调用 gl.texImage2D() 之后,WebGL 抛出一个 INVALID_VALUE 错误,然后页面就崩溃了(Chrome 的“Aw, Snap!”)。
我通过调用这个来破坏纹理:
Texture.prototype.destroy = function() {
gl.deleteTexture(this.id);
this.id = null;
};
我可以在一页会话中加载的纹理数量是否有限制?我只需要在内存中保留大约 200 个,其他的我只是在使用后销毁。是不是 WebGL 在我销毁纹理后没有释放内存?
并且为了澄清这不是图像本身的问题,如果我只是多次加载相同的图像,也会发生此错误。
我正在最新的 Chrome Canary 上对其进行测试。