I have created SPFx react functional component for export PDF.
I have used JSPDF for export pdf. When I tried to export the PDF images are cut off between two pages. Please refer to the below screenshot for better understanding.
Below is my code snippet.
const exportToPdf = () => {
ref.current.style.display = 'block';
let pdf = new JSpdf('p', 'pt', 'a4', true);
let pWidth = pdf.internal.pageSize.width; // 595.28 is the width of a4
let srcWidth = document.getElementById('toRender').scrollWidth;
let margin = 20; // narrow margin - 1.27 cm (36);
let scale = (pWidth - margin * 2) / srcWidth;
pdf.html(document.getElementById('toRender'), {
x: margin,
y: margin,
autoPaging: 'text',
margin: [10, 0, 10, 0],
html2canvas: {
scale: scale,
},
callback: function () {
pdf.save("Demo.pdf");
ref.current.style.display = 'none';
}
});
}
Can anyone help me with the same?