電網由一個

Question

好了偏移，所以我一直在試圖讓一個網格在我的畫布上工作。下面是我得到了什麼：

codepen link

for (var j = 0; j < rows; j++) { 
    for (var i = 0; i < cols; i++) { 
     var pix = new Pixel(i, j); 
     grid.push(pix); 
    } 
} 

現在的問題是，網格陣列上，對指數0的像素實際上是第二一個和最後一個是1號。我想改變它，但是我看不到代碼中的問題。

Answer 1

你Pixel#draw()功能請看：

this.draw = function() { 
    rect(this.x, this.y, l, l); 
    fill(0); 
    stroke(20); 
    if (this.on) 
     fill(255); 
} 

逐行讀取該行代碼，並仔細想想究竟它在做什麼。用一張紙和一支鉛筆穿過它來準確理解發生了什麼事。

請注意，我們在調用rect()功能第一，然後你設置填充和中風。

這將導致每平方米有以前單元格的顏色。因此，這不是你的第一個Pixel位於第二方陣，這是第二Pixel是基於第一Pixel的顏色繪製本身。這同樣適用於第一Pixel根據最後Pixel的顏色繪製本身正確的。

要解決您的問題，只需設置筆劃並填寫之前您調用rect()函數。

旁註：你也可能要養成使用{ }大括號，每if發言的習慣，甚至單行這樣的：

if(this.one){ 
    fill(255); 
} 

這不是導致你的代碼中的任何問題但是，這是一個很好的習慣。