Question

我有一个带div的函数，并使用jsPDF将其保存到PDF文档中。
我正在苦苦挣扎的是为什么jsPDF不尊重我的选择

我希望PDF文件是横向的，宽度为297mm（A4横向宽度），然后将PDF的高度设置为缩放的大小，并用图像填充PDF。

我的功能如下：

const input = document.getElementById(id);
const inputHeightMm = pxToMm(input.offsetHeight);
const inputWidthMm = pxToMm(input.offsetWidth);
const a4WidthMm = 297;
const a4HeightMm = 210;
const ratio = inputHeightMm/inputWidthMm;
console.log(a4WidthMm, a4WidthMm * ratio )

html2canvas(input)
    .then((canvas) => {
        const imgData = canvas.toDataURL('image/png');
        const pdf = new jsPDF({
            orientation: 'landscape',
            unit: "mm",
            format: [a4WidthMm, a4WidthMm * ratio ]
        });
        pdf.addImage(imgData, 'PNG', 0, 0, a4WidthMm, a4WidthMm* ratio );
        return pdf.save(`${v}.pdf`);
    });

但是发生的是，我得到一个PDF，因此图像被切掉了，因为它似乎没有将其缩放到正确的尺寸。
检查输出的PDF时，它还说只有4.13英寸x 1.96英寸（104毫米宽），而不是传递给它的297毫米

Answer 1

你能尝试

pdf.addImage(imgData, 'PNG', 0, 0, undefined, undefined );

代替

pdf.addImage(imgData, 'PNG', 0, 0, a4WidthMm, a4WidthMm* ratio );

看看是否产生相同的结果？

文档指出， addImage（图像数据，格式，x，y，宽度，高度，别名，压缩，旋转），宽度和高度用于调整生成的图像的大小。如果您将其保留为 undefined （未定义），则图像将以其原始大小和比例放置在PDF上。

jsPDF无法正确缩放html2canvas图像

1 个答案: