生成纹理时WebGL崩溃 - OutOfMemory

我目前在一个更大的Web项目中使用Three.js。一切工作正常，并没有渲染等问题。我遇到的唯一问题是具体的。生成纹理时WebGL崩溃 - OutOfMemory

在我的项目的一部分中，用户可以通过画布将图像定位在3D模型上，该画布用作纹理。有时，当用户通过点击迅速改变位置时，WebGL停止工作。

在Chrome中：

鼠！ WebGL遇到一个绊脚石 - 警报

所以用户必须重新加载页面。

这实际上是性能问题？
如果是，是减少每秒转换速度的唯一方法吗？或者有没有像try/catch这样的东西，所以它只会执行转换，如果它不会导致阻止WebGL？

我真的很想在3D模型上保留图像的实时定位。

另外我可以隐藏场景中的其他物体，所以只显示图像所在的物体，会有帮助吗？

谢谢你的时间和答案！

这是在控制台中的实际错误：

GL_INVALID_OPERATION : glGenSyncTokenCHROMIUM: 
fence sync must be flushed before generating sync token 

filename.html:1 WebGL: CONTEXT_LOST_WEBGL: loseContext: context lost

为每次点击执行的代码是：

context = canvas.getContext("2d"); 
canvas.width = 1024; 
canvas.height = 1024; 
canvas.style.width = canvas.width + "px"; 
canvas.style.height = canvas.height + "px"; 
context.clearRect(0, 0, canvas.width, canvas.height); 

context.save(); 
context.setTransform(1, 0, 0, 1, x + width/2, y + height/2); 
context.rotate(angle * TO_RADIANS); 
var imgT = new Image(); 
imgT.src = fotoprintPath + this.id; 
context.drawImage(imgT, -width/2, -height/2, width, height); 
context.restore(); 

matTexture.map = new THREE.Texture(canvas); 
matTexture.map.needsUpdate = true;

是否有事可做与asynchrone函数调用，像WebGL的还没有完成了以前的任务，所以崩溃？

在Firefox浏览器只是崩溃。我希望有人能够帮助解决这个问题，或者告诉我如何避免它。

**更新当我限制每秒点击次数不是一个令人满意的解决方案。这个解决方案的问题是，要么我必须只允许每秒1次点击（这使得定位非常慢），或者我使用我的PC可以处理的每秒点击次数，但是这导致平板电脑和慢速PC的用户仍然接收到错误。

我真正需要的是这样的

function canPerformTextureTransformation(){ 
    if(availableMemory >= neededMemory) 
     return true; 
    else 
     return false; 
}

但功能我怎么可以检查，将需要的内存和可用的内存？

来源

2017-02-20 Dubbox

你有一些我们可以测试的代码吗？ – neeh

德语中是否有原始错误？因为德语的“WebGL wurde blockiert”错误在英文中被报告为“Rats！WebGL遇到绊脚石”，它会给你更多的答案以及更好的StackOverflow答案。我个人从未遇到“WebGL被封锁”， –

是的，对不起，我只是想翻译它。 – Dubbox

我找到了一个解决方案，似乎完全解决了这个问题。

我只是降低了应用织构的大小从1024×1024到256x256的

canvas.width = 1024; --> canvas.width = 256; 
canvas.height = 1024; --> canvas.height = 256; 
canvas.style.width = canvas.width + "px"; 
canvas.style.height = canvas.height + "px";

这不是我搜索的内容，但在结果没有真正明显的变化，因此它是一个我将使用的解决方法。通过改变这一点，所有的操作都要快得多。

来源

2017-03-21 15:25:16 Dubbox

生成纹理时WebGL崩溃 - OutOfMemory

回答

相关问题