Açık Kaynak JavaScript API aracılığıyla PDF oluşturun
PDF Dosyaları Oluşturmak ve Dönüştürmek için Açık Kaynak JavaScript Kitaplığı, JavaScript aracılığıyla PDF'ye Grafik ve Metin ekleyin.
JSPDF, PDF belgesi oluşturma ve yönetimi için açık kaynaklı bir HTML5 istemci tarafı çözümüdür. Raporlama, sertifikalar, biletleme ve çok daha fazlası gibi harika özellikleri destekler. PDF web'de çok popüler olduğundan ve neredeyse her şirket onu belge ve raporları paylaşmak için kullanıyor. Yalnızca birkaç komut kullanarak, kendi uygulamanızın içindeki tüm harika özelliklere erişebilir ve bunları yeniden kullanabilirsiniz.
JsPDF kitaplığı hakkındaki harika düşünce, kullanıcılar indirme düğmesine tıkladığında bir PDF dosyası oluşturmasıdır. PDF belgeleri oluşturma, şekil çizme ve PDF dosyalarına resim ekleme, PDF'ye sayfa ekleme, metin ekleme ve görüntüleme, haritayı PDF olarak dışa aktarma, HTML'yi PDF'ye dönüştürme ve daha pek çok önemli özellik için destek içerir.
JsPDF'ye Başlarken
Başlamanın tavsiye edilen ve en kolay yolu, CDN tarafından barındırılan kitaplığı sayfanıza bırakmaktır, komut aşağıdadır.
Kurulum kodunu kullan
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js" integrity="sha384-NaWTHo/8YCBYJ59830LTz/P4aQZK1sS0SneOgAvhsIl3zBu8r9RevNg5lHCHAuQ/" crossorigin="anonymous"></script>
JavaScript Kitaplığı aracılığıyla PDF Belgeleri Oluşturma
JsPDF, JavaScript uygulamalarının içindeki değişikliklerin yanı sıra PDF belgelerinin oluşturulması için işlevsellik sunar. Kolayca PDF belgeleri oluşturabilir ve buna yeni sayfa ekleyebilirsiniz. Yeni belgeyi oluştururken belge yönünü, birimleri ve varsayılan sayfa biçimini tanımlayabilirsiniz. PDF oluşturulduktan sonra, kolaylıkla yeni sayfalar ekleyebilir, resimler vb. ekleyebilirsiniz.
JavaScript ile PDF Belgeleri Oluşturun
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");
JavaScript ile PDF Belgelerine Metin Ekleme
JsPDF API, JavaScript geliştiricilerinin bir PDF belgesine metin eklemesini ve içinde görüntülemesini kolaylaştırır. Metni çizmek için yazı tipi adını tanımlamanız gerekir. Mevcut yazı tiplerinden seçim yapabiliriz. Yazı tipi ailesini ve yazı tipi stilini değiştirmek de mümkündür. Bundan sonra yazı tipi boyutunu, metin rengini ve daha fazlasını tanımlayabiliriz.
JavaScript kullanarak Mevcut PDF'ye Metin Ekleme
//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
}
JavaScript ile PDF Belgelerine Grafik Ekleme
JsPDF kitaplığı, JavaScript profesyonelinin PDF belgelerinin içine grafik çizmesini sağlar. Grafikler her zaman içeriğe daha fazla değer katar. Öncelikle çizilen şekillerin dolgu ve kontur renklerini ayarlamalıyız. Ayrıca kontur genişliğini de ayarlayabiliriz. Her şekil çizme işlevi, merkez nokta koordinatlarını ilk iki parametre olarak alır (üçgen hariç). Ayrıca son parametre çizim stilini de alırlar. İki yarıçapı veya daireyi geçerek, yalnızca bir yarıçapı, bir üçgeni, her köşenin koordinatlarını geçerek ve daha fazlasını geçerek bir elips çizebiliriz.
JavaScript kullanarak PDF'ye resim ekleyin
// Add image to PDF
var img = new Image()
img.src = 'assets/sample.png'
pdf.addImage(img, 'png', 10, 78, 12, 15)