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.

Previous Next

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)
 Norsk