生成紋理時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

回答

相關問題