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

Hasilkan PDF melalui Open Source JavaScript API

Open Source JavaScript Library untuk Membuat & Mengonversi File PDF, menambahkan Grafik & Teks ke PDF melalui JavaScript.

JSPDF adalah solusi sisi klien HTML5 open source untuk pembuatan dan pengelolaan dokumen PDF. Ini mendukung fitur hebat seperti pelaporan, sertifikat, tiket, dan banyak lagi. Karena PDF sangat populer di seluruh web dan hampir setiap perusahaan menggunakannya untuk berbagi dokumen dan laporan. Dengan hanya menggunakan beberapa perintah, Anda dapat mengakses dan menggunakan kembali semua fitur hebat di dalam aplikasi Anda sendiri. 

Pemikiran hebat tentang perpustakaan JsPDF adalah ia menghasilkan file PDF ketika pengguna mengklik tombol unduh. Ini telah menyertakan dukungan untuk beberapa fitur menonjol, seperti menghasilkan dokumen PDF, menggambar bentuk dan memasukkan gambar ke file PDF, menambahkan halaman ke PDF, menambahkan & menampilkan teks, mengekspor peta sebagai PDF, mengonversi HTML ke PDF dan banyak lagi.

Previous Next

Memulai dengan JsPDF

Rekomendasi dan cara termudah untuk memulai adalah dengan meletakkan perpustakaan CDN yang dihosting ke halaman Anda, di bawah ini adalah perintahnya.

gunakan kode Instalasi

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

Menghasilkan Dokumen PDF melalui Perpustakaan JavaScript

JsPDF menawarkan fungsionalitas untuk pembuatan dokumen PDF serta modifikasi di dalam aplikasi JavaScript. Anda dapat dengan mudah menghasilkan dokumen PDF dan menambahkan halaman baru ke dalamnya. Anda dapat menentukan orientasi dokumen, unit, dan format halaman default saat membuat dokumen baru. Setelah PDF dibuat, Anda dapat dengan mudah menambahkan halaman baru, menyisipkan gambar, dll. ke dalamnya dengan mudah.

Buat Dokumen PDF melalui 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");

Memasukkan Teks ke Dokumen PDF melalui JavaScript

JsPDF API memfasilitasi pengembang JavaScript untuk menambahkan dan menampilkan teks di dalam dokumen PDF. Untuk menggambar teks, Anda perlu menentukan nama font. Kita bisa memilih dari font yang tersedia. Dimungkinkan juga untuk mengubah keluarga font dan gaya font. Setelah itu, kita dapat menentukan ukuran font, warna teks, dan lainnya.

Tambahkan Teks ke PDF yang Ada menggunakan 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
  }

Menambahkan Grafik ke Dokumen PDF melalui JavaScript

Pustaka JsPDF memungkinkan profesional JavaScript untuk menggambar grafik di dalam dokumen PDF. Grafik selalu menambah nilai lebih pada konten. Pertama, kita harus mengatur warna fill dan stroke warna yang digambar. Kita juga bisa mengatur lebar goresan. Setiap fungsi menggambar bentuk mengambil koordinat titik pusat sebagai dua parameter pertama (kecuali segitiga). Mereka juga mengambil gaya menggambar parameter terakhir. Kita dapat menggambar elips, dengan melewati dua radius atau lingkaran, dengan melewati hanya satu radius, segitiga, dengan melewati koordinat setiap sudut dan banyak lagi.

Tambahkan gambar ke PDF menggunakan JavaScript

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