Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Why additional space is appears in right side of pdf #447

Open
joeyy-c opened this issue Feb 6, 2023 · 0 comments
Open

Why additional space is appears in right side of pdf #447

joeyy-c opened this issue Feb 6, 2023 · 0 comments

Comments

@joeyy-c
Copy link

joeyy-c commented Feb 6, 2023

Issue:

Additional space appears on every page of the pdf, but the canvasImageWidth and pdfWidth are same, by right the content should fit the pdf width exactly. I am generating this PDF is A5 size. How to remove those spaces?

Screenshot:

Log:

image

PDF:

Screenshot_226

My Code:

// const margin = 15;
const margin = 0;
const htmlWidth = 419.52755906 - (margin * 2); // a5 size in pt
const ratio = document.getElementById('article-body').offsetWidth / htmlWidth;
const htmlHeight = document.getElementById('article-body').offsetHeight / ratio;

let pdfWidth = 419.52755906; // a5 size in pt
let pdfHeight = 595.27559055; // a5 size in pt

const totalPDFPages = Math.ceil(htmlHeight / pdfHeight) - 1;
const data = this.document.getElementById('article-body');

const canvasImageWidth = htmlWidth;
const canvasImageHeight = htmlHeight;

console.log("canvasImageWidth : " + canvasImageWidth );
console.log("pdfWidth: " + pdfWidth);

domtoimage.toJpeg(data, { quality: 0.95, bgcolor: "#ffffff" }).then (function (dataUrl) {
	let pdf = new jsPDF('p', 'pt', [pdfWidth, pdfHeight]);
	pdf.addImage(dataUrl, 'png', margin, margin, canvasImageWidth, canvasImageHeight);

	for (let i = 1; i <= totalPDFPages; i++) {
		pdf.addPage([pdfWidth, pdfHeight], 'p');
		pdf.addImage(dataUrl, 'png', margin, - (pdfHeight * i) + margin, canvasImageWidth, canvasImageHeight);
	}

	pdf.save("<?php echo $this->item->alias; ?>" + '.pdf');
})
.catch(function (error) {
	console.error('oops, something went wrong!', error);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant