P5.js: The width of line/stroke is bigger than the height

[mhmd-22]

Most appropriate sub-area of p5.js?

• [x] Core/Environment/Rendering

Details about the bug:

• p5.js version: 6.13.4
• Web browser and version: Chrome 80.0.3987.132 (Checked other browsers and still persists)
• Operating System: Linux
• Steps to reproduce this: in this code. I plan to create a grid. if you look at the picture below(see it in full resolution) you'll see vertical lines are bigger than horizontal lines even if they have the same weight?

    strokeWeight(1); // the same line weight
    stroke("#ffffff1a")
    for (let r = 0; r < rows; r++) {
        let y = (height/rows) * (r+1)
        line(0, y, width, y)
        // rect(0, y, width, 1)
        for (let c = 0; c < cols; c++) {
            let x = (width/cols) * (c+1)
            line(x, 0, x, height)
            // rect(x, 0, 1, height)
        }

    }

[welcome[bot]]

Welcome! 👋 Thanks for opening your first issue here! And to ensure the community is able to respond to your issue, be sure to follow the issue template if you haven't already.

[mhmd-22]

oops. the actual problem is using a nested loop. it'll create vertical lines on every horizontal line created

sorry about that

for (let r = 0; r < rows; r++) {
  let y = (height/rows) * (r+1)
  line(0, y, width, y)
  // rect(0, y, width, 1
 }
for (let c = 0; c < cols; c++) {
  let x = (width/cols) * (c+1)
  line(x, 0, x, height)
  // rect(x, 0, 1, height)
}