JSPDF 및 Html2Canvas를 사용하여 PDF에서 CSS 및 이미지를 렌더링하는 방법은 무엇입니까?

JSPDF로 CSS 및 이미지 렌더링

jspdf.debug.js를 사용하여 데이터를 PDF로 내보낼 때 CSS 및 이미지 렌더링에 문제가 발생하는 것이 일반적입니다. 이 문서에서는 이러한 문제를 해결하기 위한 솔루션을 제공합니다.

첫째, jspdf는 내보낸 PDF 내에서 기본적으로 CSS 렌더링을 지원하지 않습니다. 이러한 제한을 극복하려면 Html2Canvas를 활용하는 것이 좋습니다.

Html2Canvas를 구현하려면 다음 단계를 따르세요.

1. 프로젝트에 Html2Canvas JavaScript 라이브러리를 포함하세요.
2. 코드에서 pdf.fromHTML()을 pdf.addHTML()로 바꾸세요. 이 메소드는 변환할 HTML 요소를 첫 번째 매개변수로 받아들이고 콜백 함수를 두 번째 매개변수로 받아들입니다.

다음은 Html2Canvas가 통합되어 업데이트된 코드 버전입니다.

var pdf = new jsPDF('p', 'pt', 'letter');
pdf.addHTML($('#ElementYouWantToConvertToPdf')[0], function () {
    pdf.save('Test.pdf');
});

Html2Canvas를 사용하면 CSS 스타일, 이미지 등 웹페이지 요소를 PDF로 효과적으로 변환할 수 있습니다.

위 내용은 JSPDF 및 Html2Canvas를 사용하여 PDF에서 CSS 및 이미지를 렌더링하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!