Javascript ThreeJS纹理加载：在Firefox上黑色一段时间

我想在3D绘制工具上构建撤消/重做功能。 每次绘制后，我将纹理存储在一个数组中，如下所示：

        var image3 = mesh.material.map.image;
        var testCanvas = image3.getContext('2d').canvas;
        var canvasData = testCanvas.toDataURL("image/jpeg");
        undoArray[undoArrayCursor] = canvasData;

要还原它，我使用以下代码：

    var canvasimg = mesh.material.map.image;
    var img = new Image();
    img.src = srcimg;
    var tmpcanvas = document.createElement('canvas');
    tmpcanvas.width = canvasimg.width;
    tmpcanvas.height = canvasimg.height;
    var tmpctx = tmpcanvas.getContext('2d');
    tmpctx.drawImage(img,0,0);
    var pMap = new THREE.Texture( tmpcanvas );
    pMap.flipY = true;
    pMap.needsUpdate = true;
    pMaterial = new THREE.MeshLambertMaterial( { map:pMap } );
    mesh.material = pMaterial;

---

这在Chrome和IE上运行良好，但在Firefox上不起作用。我在控制台中没有收到错误/警告消息。在Firefox中，存在一些延迟之王。撤消/重做单击会随机显示全黑色或正确的纹理。一段时间后（15-20秒），当我循环执行撤消/重做时，所有纹理都会正确显示。看起来Firefox加载纹理需要一段时间。我遗漏了什么吗？

您不允许加载图像

var img = new Image();
img.onload = function(){

  var tmpcanvas = document.createElement('canvas');
  tmpcanvas.width = canvasimg.width;
  tmpcanvas.height = canvasimg.height;
  var tmpctx = tmpcanvas.getContext('2d');
  tmpctx.drawImage(this,0,0); // notice the "this" instead of img
  var pMap = new THREE.Texture( tmpcanvas );
  pMap.flipY = true;
  pMap.needsUpdate = true;
  pMaterial = new THREE.MeshLambertMaterial( { map:pMap } );
  mesh.material = pMaterial;    

};

img.src = srcimg;

---

您可能需要调整可变范围。

这太完美了。我认为已经在内存中的图像不需要加载。我的错误。