Generer PDF via Open Source JavaScript API
Open Source JavaScript-bibliotek for å lage og konvertere PDF-filer, legg til grafikk og tekst til PDF via JavaScript.
JSPDF er en åpen kildekode HTML5-løsning på klientsiden for oppretting og administrasjon av PDF-dokumenter. Den støtter flotte funksjoner som rapportering, sertifikater, billettering og mye mer. Siden PDF er veldig populært på nettet, og nesten alle selskaper bruker det til å dele dokumenter og rapporter. Ved å bruke bare et par kommandoer kan du få tilgang til og gjenbruke alle de flotte funksjonene i din egen applikasjon.
Den gode tanken med JsPDF-biblioteket er at det genererer en PDF-fil når brukere klikker på nedlastingsknappen. Den har inkludert støtte for flere fremtredende funksjoner, som å generere PDF-dokumenter, tegne former og sette inn bilder i PDF-filer, legge til sider i PDF, legge til og vise tekst, eksportere kart som PDF, konvertere HTML til PDF og mange flere.
Komme i gang med JsPDF
Den anbefalte og enkleste måten å komme i gang på er å slippe CDN-vertsbiblioteket inn på siden din, nedenfor er kommandoen.
bruk installasjonskoden
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js" integrity="sha384-NaWTHo/8YCBYJ59830LTz/P4aQZK1sS0SneOgAvhsIl3zBu8r9RevNg5lHCHAuQ/" crossorigin="anonymous"></script>
Generering av PDF-dokumenter via JavaScript-bibliotek
JsPDF tilbyr funksjonaliteten for generering av PDF-dokumenter samt modifikasjoner i JavaScript-applikasjoner. Du kan enkelt generere PDF-dokumenter og legge til en ny side på den. Du kan definere dokumentretning, enheter og standard sideformat mens du oppretter det nye dokumentet. Når PDF-en er generert kan du enkelt legge til nye sider, sette inn bilder osv. til den.
Lag PDF-dokumenter via JavaScript
import { jsPDF } from "jspdf";
// Default export is a4 paper, portrait, using millimeters for units
const doc = new jsPDF();
doc.text("Hello world!", 10, 10);
doc.save("a4.pdf");
Sette inn tekst til PDF-dokumenter via JavaScript
JsPDF API gjør det mulig for JavaScript-utviklere å legge til og vise tekst i et PDF-dokument. For å tegne teksten må du definere skriftnavnet. Vi kan velge blant de tilgjengelige fontene. Det er også mulig å endre skriftfamilien og skriftstilen. Etter det kan vi definere skriftstørrelse, tekstfarge og mer.
Legg til tekst i eksisterende PDF ved hjelp av JavaScript
//Add Text to Existing PDF
var doc = new jsPDF();
doc.addHTML(document.body, function() {
doc.text(20, 20, 'Hello world!');
doc.text(20, 30, 'This is client-side Javascript, pumping out a PDF.');
doc.addPage();
doc.text(20, 20, 'Do you like that?');
printData();
});
printData = function() {
var str = doc.output('datauristring');
console.log(str);
// window.open(str); Optional
}
Legge til grafikk til PDF-dokumenter via JavaScript
JsPDF-biblioteket lar JavaScript-profesjonelle tegne grafikk inne i PDF-dokumenter. Grafikk gir alltid mer verdi til innholdet. Først må vi angi de tegnede formene fyll- og strekfarger. Vi kan også stille inn slagbredden. Hver formtegningsfunksjon tar midtpunktkoordinatene som to første parametere (unntatt trekant). De tar også den siste parameteren tegnestil. Vi kan tegne en ellipse, ved å passere to radiuser eller sirkel, ved å passere bare én radius, en trekant, ved å passere hvert hjørnes koordinater og mer.
Legg til bilde til PDF ved hjelp av JavaScript
// Add image to PDF
var img = new Image()
img.src = 'assets/sample.png'
pdf.addImage(img, 'png', 10, 78, 12, 15)