0

I am trying to draw rectangles that represent walls on javascript html canvas. My question here is why doesn't it recognized walls[i].length?

canvas = document.getElementById("myCanvas")
context = canvas.getContext('2d')

var boxSize = 40
var wallsCoordinates = [[3,2][3,3],[3,4]]

function drawWalls(walls) {
context.fillStyle = "grey"
for(var i = 0; i < walls.length; i++) {
    for(var j = 0; j < walls[i].length; j += 2)
        context.fillRect(walls[i][j] * boxSize, walls[i][j + 1] * boxSize,
            boxSize, boxSize)
    }
}

drawWalls(wallsCoordinates)
3
  • 1
    It does recognize walls[i].length. What exactly is the problem? Note that your code will go 1 element beyond walls[i] because of that j + 1. Commented Oct 4, 2019 at 17:25
  • 1
    Typo? var wallsCoordinates = [[3,2],[3,3],[3,4]] Commented Oct 4, 2019 at 17:31
  • Yes! it was! thank you! Commented Oct 4, 2019 at 18:13

1 Answer 1

1

You forgot a comma in your array.

Change var wallsCoordinates = [[3,2][3,3],[3,4]] to var wallsCoordinates = [[3,2],[3,3],[3,4]].

Sign up to request clarification or add additional context in comments.

3 Comments

Oh god! I forgot the comma at first!
This was such a silly question of me! Only if stack OverFlow allows the author of the question to delete a question under the approval of the people who answered. Thank you tho!
If you think that answer helped you, remember to accept it. ;)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.