1. Produkte
  2.   Pdf
  3.   JavaScript
  4.   JSPDF
 
  

PDF über die Open-Source-JavaScript-API generieren

Open-Source-JavaScript-Bibliothek zum Erstellen und Konvertieren von PDF-Dateien, Hinzufügen von Grafiken und Text zu PDF über JavaScript.

JSPDF ist eine clientseitige Open-Source-HTML5-Lösung für die Erstellung und Verwaltung von PDF-Dokumenten. Es unterstützt großartige Funktionen wie Berichterstattung, Zertifikate, Ticketing und vieles mehr. Da PDF im Internet sehr beliebt ist und fast jedes Unternehmen es verwendet, um Dokumente und Berichte auszutauschen. Mit nur wenigen Befehlen können Sie auf alle großartigen Funktionen in Ihrer eigenen Anwendung zugreifen und diese wiederverwenden. 

Das Tolle an der JsPDF-Bibliothek ist, dass sie eine PDF-Datei generiert, wenn Benutzer auf die Download-Schaltfläche klicken. Es bietet Unterstützung für mehrere herausragende Funktionen, wie z. B. das Erstellen von PDF-Dokumenten, das Zeichnen von Formen und das Einfügen von Bildern in PDF-Dateien, das Hinzufügen von Seiten zu PDF, das Hinzufügen und Anzeigen von Text, das Exportieren von Karten als PDF, das Konvertieren von HTML in PDF und vieles mehr.

Previous Next

Erste Schritte mit JsPDF

Der empfohlene und einfachste Weg, um loszulegen, besteht darin, die vom CDN gehostete Bibliothek auf Ihrer Seite abzulegen. Nachfolgend finden Sie den Befehl.

Installationscode verwenden

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js" integrity="sha384-NaWTHo/8YCBYJ59830LTz/P4aQZK1sS0SneOgAvhsIl3zBu8r9RevNg5lHCHAuQ/" crossorigin="anonymous"></script>

Generieren von PDF-Dokumenten über die JavaScript-Bibliothek

JsPDF bietet die Funktionalität für die Generierung von PDF-Dokumenten sowie Modifikationen innerhalb von JavaScript-Anwendungen. Sie können ganz einfach PDF-Dokumente generieren und neue Seiten hinzufügen. Sie können Dokumentausrichtung, Einheiten und das Standardseitenformat beim Erstellen des neuen Dokuments definieren. Sobald das PDF generiert ist, können Sie problemlos neue Seiten hinzufügen, Bilder einfügen usw.

Erstellen Sie PDF-Dokumente über 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");

Einfügen von Text in PDF-Dokumente über JavaScript

Die JsPDF-API erleichtert JavaScript-Entwicklern das Hinzufügen und Anzeigen von Text in einem PDF-Dokument. Um den Text zu zeichnen, müssen Sie den Schriftartnamen definieren. Wir können aus den verfügbaren Schriftarten wählen. Es ist auch möglich, die Schriftfamilie und den Schriftstil zu ändern. Danach können wir Schriftgröße, Textfarbe und mehr definieren.

Fügen Sie mithilfe von JavaScript Text zu einer vorhandenen PDF-Datei hinzu

  //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
  }

Hinzufügen von Grafiken zu PDF-Dokumenten über JavaScript

Die JsPDF-Bibliothek ermöglicht es JavaScript Professional, Grafiken in PDF-Dokumente zu zeichnen. Grafiken verleihen dem Inhalt immer mehr Wert. Zuerst müssen wir die Füll- und Strichfarben der gezeichneten Formen festlegen. Wir können auch die Strichbreite einstellen. Jede Formzeichnungsfunktion nimmt die Mittelpunktkoordinaten als zwei erste Parameter (außer Dreieck). Sie übernehmen auch den Zeichenstil des letzten Parameters. Wir können eine Ellipse zeichnen, indem wir zwei Radien oder einen Kreis passieren, indem wir nur einen Radius passieren, ein Dreieck, indem wir die Koordinaten jeder Ecke passieren und mehr.

Bild mit JavaScript zu PDF hinzufügen

  // Add image to PDF
  var img = new Image()
  img.src = 'assets/sample.png'
  pdf.addImage(img, 'png', 10, 78, 12, 15)
 Deutsch