Ücretsiz JavaScript API'si ile PDF Dosyaları Oluşturma

PDFMake'e Başlarken

PDFMake npm'de mevcuttur, kolayca indirebilir ve makinenize kurabilirsiniz. Sorunsuz kurulum için lütfen aşağıdaki komutu kullanın.

bower install pdfmake

JavaScript Kitaplığını kullanarak PDF Dosyaları Oluşturun

Açık kaynaklı JavaScript kitaplığı PDFMake, yazılım programcılarının JavaScript kodunu kullanarak kendi uygulamaları içinde PDF belgeleri oluşturmasını kolaylaştırır. Kitaplık, boyut, renk ve biçimlendirme ile yazı tipi türlerini seçme, yeni bir sayfa ekleme, sütun ekleme, stil ekleme ve uygulama, tablo ekleme, istenmeyen sayfaları silme ve daha pek çok PDF dosyalarıyla çalışmak için eksiksiz bir dizi özellik vermiştir. daha fazla.

PDF Dosyasına Üstbilgi ve Altbilgi Ekle

Üstbilgiler ve altbilgiler, PDF belgelerinin çok kullanışlı parçalarıdır ve içeriğin, kullanıcıların bir belgenin her sayfasında görünmesini istedikleri yazar adı, belge başlığı, sayfa numaraları, logo ve çok daha fazlası gibi kısımlarını dahil etmek için kullanılabilir. JavaScript kitaplığı PDFMake, bir PDF belgesine üstbilgi ve altbilgi eklemek ve değiştirmek için tam destek sağlamıştır. Tekrarlayan üstbilgi/altbilgi ekleme, üstbilgi/altbilgiye resim ekleme, sayfa numaraları ekleme ve çok daha fazlasını destekler.

 var docDefinition = {
 header: 'simple text',
 footer: {
  columns: [
   'Left part',
   { text: 'Right part', alignment: 'right' }
  ]
 },
 content: (...)
};

PDF Dosyalarına Görüntü Ekleme

Açık kaynak JavaScript kitaplığı PDFMake, JavaScript komutlarını kullanarak PDF dosyaları içindeki görüntülerin eklenmesi ve değiştirilmesi için tam destek sağlamıştır. Kitaplık, görüntü genişliğini ve yüksekliğini ayarlamak, bir görüntüyü bir dikdörtgenin içine yerleştirmek, URL'ler aracılığıyla bir görüntüyü çağırmak, görüntüyü orantılı olarak ölçeklemek ve görüntü genişletmek için özellikler sağlamıştır. Aynı görüntüyü birden fazla düğümde kullanmak istiyorsanız, onu görüntü sözlüğüne koymanız ve adıyla çağırmanız yeterlidir.

 var docDefinition = {
 content: [
  {
   // you'll most often use dataURI images on the browser side
   // if no width/height/fit is provided, the original size will be used
   image: 'data:image/jpeg;base64,...encodedContent...'
  },
  {
   // if you specify width, image will scale proportionally
   image: 'data:image/jpeg;base64,...encodedContent...',
   width: 150
  },
  {
   // if you specify both width and height - image will be stretched
   image: 'data:image/jpeg;base64,...encodedContent...',
   width: 150,
   height: 150
  },
  {
   // you can also fit the image inside a rectangle
   image: 'data:image/jpeg;base64,...encodedContent...',
   fit: [100, 100]
  },
  {
   // if you reuse the same image in multiple nodes,
   // you should put it to to images dictionary and reference it by name
   image: 'mySuperImage'
  },
  {
   image: 'myImageDictionary/image1.jpg'
  },
  {
   // in browser is supported loading images via url from reference by name in images
   image: 'snow'
  },
  {
   image: 'strawberries'
  },
 ],
 images: {
  mySuperImage: 'data:image/jpeg;base64,...content...',
  snow: 'https://picsum.photos/seed/picsum/200/300',
  strawberries: {
   url: 'https://picsum.photos/id/1080/367/267'
   headers: {
    myheader: '123',
    myotherheader: 'abc',
   }
  }
 }
};

Sayfa Yönlendirme ve Kenar Boşluğu Desteği

Ücretsiz JavaScript kitaplığı PDFMake, JavaScript uygulamalarında sayfa boyutunu, sayfa yönünü ve sayfa kenar boşluklarını ayarlama desteği içerir. Sayfa boyutunu ayarlamak için yeni sayfanın genişliğini ve yüksekliğini sağlamanız gerekir. Kitaplık varsayılan olarak dikey sayfa yönlendirmesini kullanır, ancak tek satırlık kodla kolayca yatay olarak ayarlayabilir. Ayrıca sayfa kenar boşluklarını ayarlamak için destek sağlar ve kullanıcıların sayfa sonlarını dinamik olarak denetlemesine olanak tanır. Sol, üst, sağ, alt, yatay ve dikey kenar boşluklarını destekler.

 
var dd = {
	content: [
		{
			stack: [
				'This header has both top and bottom margins defined',
				{text: 'This is a subheader', style: 'subheader'},
			],
			style: 'header'
		},
		{
			text: [
				'Margins have slightly different behavior than other layout properties. They are not inherited, unlike anything else. They\'re applied only to those nodes which explicitly ',
				'set margin or style property.\n',
			]
		},
		{
			text: 'This paragraph (consisting of a single line) directly sets top and bottom margin to 20',
			margin: [0, 20],
		},
		{
			stack: [
				{text: [
						'This line begins a stack of paragraphs. The whole stack uses a ',
						{text: 'superMargin', italics: true},
						' style (with margin and fontSize properties).',
					]
				},
				{text: ['When you look at the', {text: ' document definition', italics: true}, ', you will notice that fontSize is inherited by all paragraphs inside the stack.']},
				'Margin however is only applied once (to the whole stack).'
			],
			style: 'superMargin'
		},
	],
	styles: {
		header: {
			fontSize: 18,
			bold: true,
			alignment: 'right',
			margin: [0, 190, 0, 80]
		},
		subheader: {
			fontSize: 14
		},
		superMargin: {
			margin: [20, 0, 40, 0],
			fontSize: 15
		}
	}
}

JavaScript ile PDF'ye Tablo Ekleme

Açık kaynak kitaplığı PDFMake, bilgisayar programcılarının PDF dosyalarına tablolar eklemesini ve güncellemesini sağlar. Kitaplık, tablonun satır sütunlarını ve hücrelerini işlemek için çeşitli gelişmiş özellikleri destekler. Tablo hizalama, stil tablo kenarlıkları, genişlikleri yüzde olarak tanımlama, tabloları döndürme, yeni sayfada Tablo Başlığı satırını tanımlama ve daha pek çok desteği içerir.

 var docDefinition = {
 content: [
  {
   layout: 'lightHorizontalLines', // optional
   table: {
    // headers are automatically repeated if the table spans over multiple pages
    // you can declare how many rows should be treated as headers
    headerRows: 1,
    widths: [ '*', 'auto', 100, '*' ],
    body: [
     [ 'First', 'Second', 'Third', 'The last one' ],
     [ 'Value 1', 'Value 2', 'Value 3', 'Value 4' ],
     [ { text: 'Bold value', bold: true }, 'Val 2', 'Val 3', 'Val 4' ]
    ]
   }
  }
 ]
};
pdfMake.createPdf(docDefinition, tableLayouts, fonts, vfs)
// tableLayouts, fonts and vfs are all optional - falsy values will cause