将图像添加到 PDF 时不显示图像

Question

我正在尝试使用图像创建 PDF。我有如下图片的 URL：var url = "https://firebasestorage.googleapis.com/v0/b/dicom-poc.appspot.com/o/images%2FNiouCzjBYna8Wx1VO2x3UST5tDc2%2F2020-10-07%2F05%3A03%3A58%2Fvisualization%2FL-CC。 png?alt=media&token=dce8859a-3427-432b-8176-590e9569aad9"我的代码在这里：var pdf = new jsPDF();var img = new Image();var canvas = document.createElement('canvas');var ctx = canvas.getContext('2d');img = document.createElement('img');img.src = url;img.onload = function(){   canvas.height = img.height;   canvas.width = img.width;   var dataURL = canvas.toDataURL('image/png')   var base64 = dataURL.replace(/^data:.+;base64,/, '');     pdf.text("Hi");   pdf.addImage(base64,'PNG',5,5,50,50);   pdf.save("download.pdf");}运行上述代码后，PDF 已成功下载，文本为“Hi”，但图像不存在。我尝试了人们建议的多种解决方案，但没有结果。你能指导我吗？

Answer 1

你没有在画布上画任何东西。

var pdf = new jsPDF();

var img = new Image();

var canvas = document.createElement('canvas');

var ctx = canvas.getContext('2d');

img = document.createElement('img');

img.src = url;

img.onload = function(){

   canvas.height = img.height;

   canvas.width = img.width;

   ctx.drawImage(img, img.width, img.width);

   var dataURL = canvas.toDataURL('image/png')

   var base64 = dataURL.replace(/^data:.+;base64,/, '');  

   pdf.text("Hi");

   pdf.addImage(base64,'PNG',5,5,50,50);

   pdf.save("download.pdf");

}