During image conversion, we assign the image.src and immediately draw it to a canvas:
var imageUrl = node.getAttribute("xlink:href") || node.getAttribute("href");
var image = new Image();
image.src = imageUrl;
...
context.drawImage(image, 0, 0, width, height);
The assignment is asynchronous and we should wait for image.onload to fire before drawing it into the canvas.
Possible workaround:
Preload images before even starting the conversion. See attached file which outlines the approach (changes are marked by //***). Due to the change, the main function returns a Promise then.
svg2pdf_js.txt
Rather than preloading the images we should actually use image.onload where the image is converted. However, due to the asynchronous assignment, this would need additional changes in the other parts of the code.
HackbrettXXX
commented
3 years ago
During image conversion, we assign the image.src and immediately draw it to a canvas:
The assignment is asynchronous and we should wait for image.onload to fire before drawing it into the canvas.
Possible workaround: Preload images before even starting the conversion. See attached file which outlines the approach (changes are marked by //***). Due to the change, the main function returns a Promise then. svg2pdf_js.txt
Rather than preloading the images we should actually use image.onload where the image is converted. However, due to the asynchronous assignment, this would need additional changes in the other parts of the code.