Last active
July 6, 2018 16:02
-
-
Save petrusnog/c1164e96b2348e20610545447793a488 to your computer and use it in GitHub Desktop.
Passo a passo da implementação de um sistema JS que converte HTML puro (sem CSS) em PDF.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//COMO IMPLEMENTAR UM SISTEMA QUE CONVERTE HTML PURO EM PDF? | |
//1 - Defina onde o script irá começar a ler o HTML que será convertido e onde ele terminará | |
<div id="HTMLtoPDF"> //COMEÇO | |
<header> | |
<h1>AQUI MESMO!</h1> | |
<p>Adicione aqui o conteúdo que pretende converter para pdf.</p> | |
</header> | |
</div> //FIM | |
//2 - Crie o botão que irá chamar a função "HTMLtoPDF()" | |
<a onclick="HTMLtoPDF()" href="#">Baixar PDF</a> | |
//3 - Importe os seguintes scripts para seu código | |
// JSPDF (link para download: https://drive.google.com/file/d/0BwHqLHKAfVJeUGVDRmw1aWZCQUk/view ) | |
// JQUERY (link para download: https://drive.google.com/file/d/0BwHqLHKAfVJeS0ZkbDV5NE9hM3M/view ) | |
<script src="seu-path-para-arquivos-js/jspdf.js"></script> | |
<script src="seu-path-para-arquivos-js/jquery-2.1.3.js"></script> | |
//4 - Partindo para o JS | |
<script type="text/javascript"> | |
function HTMLtoPDF(){ | |
var pdf = new jsPDF('p', 'pt', 'letter'); | |
source = $('#HTMLtoPDF')[0]; | |
specialElementHandlers = { | |
'#bypassme': function(element, renderer){ | |
return true | |
} | |
} | |
margins = { | |
top: 50, | |
left: 60, | |
width: 545 | |
}; | |
pdf.fromHTML( | |
source // HTML string or DOM elem ref. | |
, margins.left // x coord | |
, margins.top // y coord | |
, { | |
'width': margins.width // max width of content on PDF | |
, 'elementHandlers': specialElementHandlers | |
}, | |
function (dispose) { | |
// dispose: object with X, Y of the last line add to the PDF | |
// this allow the insertion of new lines after html | |
pdf.save('html2pdf.pdf'); //NOME DO ARQUIVO PDF | |
} | |
) | |
} | |
</script> | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment