processing/p5.js — 每当我增加单元格数量时，2D 网格就会缩小

Question

我正在使用 rect() 在画布上绘制 17×17 2D 网格。但每当我增加单元格数量（例如 20×20）时，画布上的网格就会缩小。一开始我以为是浮点精度损失问题。然而事实似乎并非如此。与屏幕的密度或像素有关吗？因为它在不同尺寸的屏幕上发生的情况不同。

这是我在draw()中的代码：

let size = width / 17;

for (let x = 0; x < size; x++) {

    for (let y = 0; y < size; y++) {

        rect(x * size, y * size, size, size);

    }

}

19×19 20×20

Answer 1

你必须从 0 迭代到单元格数量，而不是从 0 到size。size是单个细胞的大小，而不是细胞的数量：let no_of_cells = 20;let size = width / no_of_cells;for (let x = 0; x < no_of_cells; x++) {&nbsp; &nbsp; for (let y = 0; y < no_of_cells; y++) {&nbsp; &nbsp; &nbsp; &nbsp; rect(x * size, y * size, size, size);&nbsp; &nbsp; }}