如何在for循環上創建獨特的canvas元素

編輯：問題出在我的代碼中，我沒有用正確的索引查詢數組。對於任何尋找這個問題的答案，Karthik Ar回答了它的權利。感謝所有的評論！如何在for循環上創建獨特的canvas元素

我努力在for循環中創建一個獨特的canvas元素數組。看起來，所有的元素都是第一個創建元素的副本。我說這是因爲我需要將此畫布存儲在數組中，然後隨時訪問它們的上下文。

var _ctxs = new Array(); 
    function createCells() 
      { 
       _w = window.innerWidth; 
       _h = window.innerHeight; 
       var side = 300; 
       //set amount of steps 
       var stepsW = Math.ceil(_w/side) + 1; 
       var stepsH = Math.ceil(_h/(side/2)) + 1; 

       console.log("create cells"); 
       for (var i = 0; i < stepsH; i++) 
       { 
        var p = (i%2 == 0)?0:side/2; 
        for (var j = 0; j < stepsW; j++) 
        { 
         var _tempCanvas = $('<canvas/>', {id: "i_" + i + "_" + j, width : side, height : side}); 
         _tempCanvas.css({ 
          'position' : 'absolute', 
          'top' : (i*(side/2)+1) - side/2, 
          'left' : (j*side + p) + 1 - side/2 
         }); 

         //var _tempCtx = _tempCanvas[0].getContext('2d'); 
         _ctxs.push(_tempCanvas[0]); 

         $('body').prepend(_tempCanvas); 
         k++; 
        }; 
       }; 
      }

Anythoughs？提前致謝！

來源

2013-01-06 Drala

除了一些缺失的變量，這對我很有用。該數組包含附加的每個畫布元素。 – pimvdb

你沒有返回'_ctxs'。你打算以後如何訪問它？除此之外，代碼工作正常 – Alexander

@pimvdb我添加了缺少的變量。你是否檢查過Canvas是否處於正確的位置並擁有唯一的id？ – Drala

看你的代碼工作檢查數組。

$(document).ready(jqueryready); 
function jqueryready(){ 
for (var i = 0; i < 5; i++) 
      { 
for (var j = 0; j < 5; j++) 
       { 
        var _tempCanvas = $('<canvas/>', {id: i+""+j, width : 10, height : 10}); 
        console.log(_tempCanvas[0].id); 
        $('body').prepend(_tempCanvas); 
       }; 
       } 
}

這會爲畫布創建唯一的ID。

來源

2013-01-06 13:50:30

雖然我的問題在我的代碼中的其他位置，但您的答案回答了這個問題:) – Drala

如何在for循環上創建獨特的canvas元素

回答

相關問題