Thank you for your reply so far!
There's no array for height as the height of all pictures is the same (they are automatically resized to the canvas height, while preserving the aspect ratio).
Unfortunately changing the code into this:
Code:
for (i=0; i<numberofpics; i++) {
img[i] = new Image();
img[i].onload = function() {
ctxsrc.drawImage(img[i], sourcepointer, 0, widthpic[i], heightcanvas);
sourcepointer=sourcepointer+widthpic[i];
};
img[i].src = imgsrc[i];
}
...gives the very same issue.
widthpic definitely contains a value, as...
Code:
img[0] = new Image();
img[0].onload = function() {
ctxsrc.drawImage(img[0], sourcepointer, 0, widthpic[0], heightcanvas);
sourcepointer=sourcepointer+widthpic[0];
};
img[0].src = imgsrc[0];
img[1] = new Image();
img[1].onload = function() {
ctxsrc.drawImage(img[1], sourcepointer, 0, widthpic[1], heightcanvas);
sourcepointer=sourcepointer+widthpic[1];
};
img[1].src = imgsrc[1];
for (i=0; i<numberofpics; i++) {
img[i] = new Image();
img[i].onload = function() {
ctxsrc.drawImage(img[i], sourcepointer, 0, widthpic[i], heightcanvas);
sourcepointer=sourcepointer+widthpic[i];
};
img[i].src = imgsrc[i];
}
...shows. This displays two pictures. The loop however generates an error.
ctxsrc.drawImage(img[i], sourcepointer, 0, widthpic[i], heightcanvas); <= Uncaught TypeError: Type error (repeated 9 times)