1. Produkty
  2.   PDF
  3.   JavaScript
  4.   JSPDF
 
  

Generuj PDF za pomocą Open Source JavaScript API

Open Source JavaScript Library do tworzenia i konwertowania plików PDF, dodawaj grafikę i tekst do PDF za pomocą JavaScript.

JSPDF to rozwiązanie po stronie klienta HTML5 typu open source do tworzenia i zarządzania dokumentami PDF. Obsługuje wspaniałe funkcje, takie jak raportowanie, certyfikaty, sprzedaż biletów i wiele innych. Ponieważ PDF jest bardzo popularny w Internecie i prawie każda firma używa go do udostępniania dokumentów i raportów. Używając tylko kilku poleceń, możesz uzyskać dostęp do wszystkich wspaniałych funkcji we własnej aplikacji i ponownie je wykorzystać. 

Świetnym pomysłem na bibliotekę JsPDF jest to, że generuje plik PDF, gdy użytkownik kliknie przycisk pobierania. Zawiera obsługę kilku ważnych funkcji, takich jak generowanie dokumentów PDF, rysowanie kształtów i wstawianie obrazów do plików PDF, dodawanie stron do plików PDF, dodawanie i wyświetlanie tekstu, eksportowanie mapy jako PDF, konwertowanie HTML na PDF i wiele innych.

Previous Next

Pierwsze kroki z JsPDF

Zalecanym i najłatwiejszym sposobem rozpoczęcia jest upuszczenie biblioteki hostowanej przez CDN na swoją stronę, poniżej znajduje się polecenie.

użyj kodu instalacyjnego!

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

Generowanie dokumentów PDF za pomocą biblioteki JavaScript

JsPDF oferuje funkcjonalność generowania dokumentów PDF oraz modyfikacji w aplikacjach JavaScript. Możesz łatwo generować dokumenty PDF i dodawać do nich nową stronę. Podczas tworzenia nowego dokumentu można zdefiniować orientację dokumentu, jednostki i domyślny format strony. Po wygenerowaniu pliku PDF możesz z łatwością dodawać do niego nowe strony, wstawiać obrazy itp.

Twórz dokumenty PDF za pomocą 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");

Wstawianie tekstu do dokumentów PDF za pomocą JavaScript

Interfejs API JsPDF ułatwia programistom JavaScript dodawanie i wyświetlanie tekstu w dokumencie PDF. Aby narysować tekst, musisz zdefiniować nazwę czcionki. Do wyboru mamy dostępne czcionki. Możliwa jest również zmiana rodziny i stylu czcionki. Następnie możemy zdefiniować rozmiar czcionki, kolor tekstu i nie tylko.

Dodaj tekst do istniejącego pliku PDF za pomocą 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
  }

Dodawanie grafiki do dokumentów PDF za pomocą JavaScript

Biblioteka JsPDF umożliwia profesjonalistom JavaScript rysowanie grafiki w dokumentach PDF. Grafiki zawsze dodają więcej wartości do treści. Najpierw musimy ustawić kolory wypełnienia i obrysu rysowanych kształtów. Możemy również ustawić szerokość kreski. Każda funkcja rysowania kształtu przyjmuje współrzędne punktu środkowego jako dwa pierwsze parametry (z wyjątkiem trójkąta). Przyjmują również ostatni styl rysowania parametrów. Możemy narysować elipsę, przekazując dwa promienie lub okrąg, przekazując tylko jeden promień, trójkąt, przekazując współrzędne każdego rogu i więcej.

Dodaj obraz do pliku PDF za pomocą JavaScript

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