O jsPDF é uma biblioteca Javascript que permite gerar arquivos PDF de forma programática. Não tem dependências e é acessível a partir de qualquer dispositivo com um navegador, para que você possa gerar arquivos PDF rapidamente.
É a única biblioteca que permite gerar PDFs sem precisar instalar nada. Você apenas escreve o código – desta forma, não importa em que tipo de ambiente você está: no trabalho, em casa ou em trânsito.
Converter o conteúdo da web em um documento limpo e com aparência profissional pode ser uma tarefa complicada, mas com as ferramentas certas, esse processo pode ser simplificado e muito mais fácil de ser concluído por qualquer pessoa sem qualquer habilidade de codificação.
Em primeiro lugar, você precisa instalar a biblioteca jsPDF:
npm install jspdf --save
Se preferir você também pode usar o CDN,
Crie uma função para gerar PDF, código simples para converter HTML em PDF, ele obtém todo o conteúdo de #dataID e o converte em um arquivo PDF com opções fornecidas como margem, tamanho da página, etc.
function gerarPDF() {
var doc = new jsPDF("p", "pt", "a4", true);
var a4Width = Number(doc.internal.pageSize.getWidth());
doc.fromHTML($("#dataID").html(), 20, 0, {
pagesplit: true,
"width": (a4Width - 40) // for margin right
},
function(dispose) {
doc.save("MeuPDF.pdf");
}
);
}
HTML:
<div id="PDFID">
<h2>HTML de exemplo para jsPDF</h2>
<p>HTML é a linguagem de marcação padrão para a criação de páginas da web</p>
<h4>O que é HTML?</h4>
<ul>
<li>HTML stands for Hyper Text Markup Language</li>
<li>HTML is the standard markup language for creating Web pages</li>
<li>HTML describes the structure of a Web page</li>
<li>HTML consists of a series of elements</li>
<li>HTML elements tell the browser how to display the content</li>
<li>HTML elements label pieces of content such as "this is a heading", "this is a paragraph", "this is a link", etc.</li>
</ul>
<p>
<!-- It is a Paragraph tag for creating the paragraph -->
<b> HTML </b> stands for <i> <u> Hyper Text Markup Language. </u> </i> It is used to create a web pages and
applications. This language
is easily understandable by the user and also be modifiable. It is actually a Markup language, hence it provides
a flexible way for designing the
web pages along with the text.
</p>
HTML file is made up of different elements. <b> An element </b> is a collection of <i> start tag, end tag,
attributes and the text between them</i>.
</p>
</div>
Mais ajuda para conhecer a biblioteca jsPDF
Você pode encontrar todas as opções aqui: https://raw.githack.com/MrRio/jsPDF/master/docs/jsPDF.html se quiser explorá-lo mais.
Você pode obter plug-ins extras aqui: https://github.com/topics/jspdf-plugin
É uma biblioteca muito simples e fácil de usar que você pode implementar em seu site.
O que podemos criar com jsPDF
- Agradecimentos a https://github.com/shivang2joshi, parabéns pelo trabalho!
- Converter imagem para site demo em PDF
- Criar app para curriculum online Resumes Online
Espero que goste do tutorial, se você estiver enfrentando algum problema, escreva nos comentários.
A postagem Converter HTML em PDF em Javascript usando jsPDF com download de exemplo apareceu pela primeira vez no PHP Lift.