How to fill this jagged array?-CodePudding

When outside of the function scope, Tiles[[]] loses all of it's values.

var Tiles= [[]];
function drawGrid(){
    Grid=true;
    // for the amout of rows
    for (let rowcount = 0; rowcount < amountOfrows; rowcount  ) {
        ctxB.lineWidth = 1;
        
        // filling the rows
        // check for (un)even
        if(rowcount%2==0){
            for (let boxcount = 0; boxcount < amountOfHorBoxes; boxcount  ) {
                ctxB.strokeStyle = "black";
                ctxB.fillStyle = "white";
                ctxB.beginPath();
                ctxB.rect(addHorBox, addVertBox, boxsize, boxsize);
                ctxB.fill();
                ctxB.closePath();
                ctxB.stroke();
                Tiles[rowcount[boxcount]]={x1: addHorBox, y1: boxsize*rowcount, x2: addHorBox boxsize, y2: boxsize*(rowcount 1)};
                //console.log('Tiles:',Tiles[rowcount[boxcount]]);
                
                addHorBox =boxsize;
            }
        }else{
            for (let boxcount = 0; boxcount < amountOfHorBoxes; boxcount  ) {
                ctxB.strokeStyle = "black";
                ctxB.fillStyle = "white";
                ctxB.beginPath();
                ctxB.rect(addHorBox boxsize/2, addVertBox, boxsize, boxsize);
                ctxB.fill();
                ctxB.closePath();
                ctxB.stroke(); 
                Tiles[rowcount[boxcount]]={x1: addHorBox, y1: boxsize*rowcount, x2: addHorBox boxsize, y2: boxsize*(rowcount 1)};
                //console.log('Tiles:',Tiles[rowcount[boxcount]]);

                addHorBox =boxsize;
            }
        }
        addHorBox=0;
        addVertBox =boxsize;
    }
}

I haven't fully been able to check if I fill up the array properly, but regardless, it doesn't hold the values outside of it's scope. How do I do this?

CodePudding user response：

In you code you are accessing the Tiles array like so:

Tiles[rowcount[boxcount]]={x1: addHorBox, y1: boxsize*rowcount, x2: addHorBox boxsize, y2: boxsize*(rowcount 1)};

So the index you are using is the value stored at the boxcount property of rowcount, i.e the same as doing:

let index = rowcount[boxcount];
Tiles[index]={x1: addHorBox, y1: boxsize*rowcount, x2: addHorBox boxsize, y2: boxsize*(rowcount 1)};

Since the value of rowcount[boxcount] is undefined, you're storing your object in Tile[undefined].

In order to access the two dimensional array, you need to do this:

Tiles[rowcount][boxcount]={x1: addHorBox, y1: boxsize*rowcount, x2: addHorBox boxsize, y2: boxsize*(rowcount 1)};