javascript for循環不會循環結束

我有一個應放置在FabricJS Canvas上的對象數組。我遍歷數組，查看Canvas應該放置哪些對象，如果該對象不存在並創建畫布並將對象放置在那裏，則創建該畫布。它可以很好地處理文本和幾何形狀，但它將圖像放置在最後一張幻燈片上。當我調試它打破了上線「fabric.Image.fromURL（SRC，函數（oImg）{」和進入下一個迭代javascript for循環不會循環結束

function dataIsLoaded(){ 
    for (var i=0; i<myObj.objects.length; i++){ 
     var slideIndex= myObj.objects[i].canvas; 
     try{ 
      var canvas = document.getElementById('slide_'+slideIndex).fabric; 
     } catch(e){  
      createCanvas(slideIndex); 
      var canvas = document.getElementById('slide_'+slideIndex).fabric; 
     }  
     var type= myObj.objects[i].type; 
     if(type =="image"){ 
      var src = myObj.objects[i].src; 
      var top = myObj.objects[i].top; 
      var left = myObj.objects[i].left; 
      var angle = myObj.objects[i].angle; 
      var scaleX = myObj.objects[i].scaleX; 
      var scaleY = myObj.objects[i].scaleY; 
      fabric.Image.fromURL(src, function(oImg){ 
       oImg.set({ 
        left: left, 
        top: top, 
        angle: angle, 
        scaleX: scaleX, 
        scaleY:scaleY   
       }); 
       canvas.add(oImg); 

      });   
     } 
    } 
}

而且MyObj中的樣子：

var myObj ={ 
    'objects': [ 
     { 
      'type': 'image', 
      'canvas': '0', 
      'src': 'file:///D:/Flyingblocks/designer/4.png', 
      'top': 0, 
      'left': 0, 
      'angle': 0, 
      'originX': 'left', 
      'originY': 'top', 
      'scaleX': 1.50195, 
      'scaleY': 1.50195 
     },{ 
     'type': 'text', 
     'text': 'Hallo', 
     'canvas': '1', 
     'top': 221, 
     'left': 162, 
     'angle': 0, 
     'scaleX': 1, 
     'scaleY': 1, 
     'originX': 'left', 
     'originY': 'top', 
     'fill': 'rgba(0,0,0,1.0)', 
     'fontFamily': 'Aharoni', 
     'fontSize': 40 
    } 
    ] 
}

來源

2014-10-08 Matthias

到回調被調用時，循環已經在其第二迭代和「左」等的值已經改變。 – 2014-10-08 11:27:38

你不能加載任何本地圖像或文件在JavaScript中，將有CORS問題。您可以給任何圖像的任何實時的網址，並將工作

來源

2014-10-14 07:44:46 Innodel

javascript for循環不會循環結束

回答

相關問題