var CanvasB = 500;
var CanvasH = 400;
var Rand = 30;
var Seiten = [25, 5, 61, 20, 100, 4, 3, 3, 3, 50, 30, 20, 40, 6, 70];
function setup() {
createCanvas(CanvasB, CanvasH);
}
function draw() {
background(220);
var pos = 0; // Startpunkt links Regal
var Regal = 20;
var abst = 4;
var abzug = 0;
var start = 20
strokeWeight(2);
for (let i = 0; i < Seiten.length; i++) {
//Anzahl Linien
for (let x = 1; x <= Seiten[i] * abst; x += abst) {
if (pos + x + 20 > CanvasB) {
//Wenn linien aus Canvas ragen
Regal += 40;
pos = 20;
abzug = x;
}
line(
pos + x - abzug,
Regal,
pos + x - abzug,
Regal + 30);
}
pos += Seiten[i] * abst + 2 * abst ;
}
}

Hi, everyone
I have a problem in my code and I can’t figure out how to solve it.

I have a list of page numbers of books, I would like to draw a line for every page of a book. Between pages there is a space of 4px and when a new book starts, the space is doubled. If a line extends beyond the edge of the canvas I want to start a new line. But I can’t get the first line to start after 20px like the other lines
can someone help me rewrite the code to make it work?