1. Товары
  2.   PDF
  3.   JavaScript
  4.   JSPDF
 
  

Создание PDF-файла с помощью API JavaScript с открытым исходным кодом

Библиотека JavaScript с открытым исходным кодом для создания и преобразования PDF-файлов, добавления графики и текста в PDF с помощью JavaScript.

JSPDF — это клиентское решение HTML5 с открытым исходным кодом для создания PDF-документов и управления ими. Он поддерживает отличные функции, такие как отчеты, сертификаты, билеты и многое другое. Поскольку PDF очень популярен в Интернете, и почти каждая компания использует его для обмена документами и отчетами. Используя всего пару команд, вы можете получить доступ ко всем замечательным функциям вашего собственного приложения и повторно использовать их. 

Отличительной особенностью библиотеки JsPDF является то, что она создает PDF-файл, когда пользователи нажимают кнопку загрузки. Он включает поддержку нескольких важных функций, таких как создание PDF-документов, рисование фигур и вставка изображений в PDF-файлы, добавление страниц в PDF, добавление и отображение текста, экспорт карты в формате PDF, преобразование HTML в PDF и многое другое.

Previous Next

Начало работы с JsPDF

Рекомендуемый и самый простой способ начать работу — поместить размещенную библиотеку CDN на свою страницу, ниже приведена команда.

использовать код установки

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

Создание PDF-документов с помощью библиотеки JavaScript

JsPDF предлагает функциональные возможности для создания PDF-документов, а также модификации внутри приложений JavaScript. Вы можете легко создавать PDF-документы и добавлять в них новую страницу. Вы можете определить ориентацию документа, единицы измерения и формат страницы по умолчанию при создании нового документа. После создания PDF-файла вы можете с легкостью добавлять в него новые страницы, вставлять изображения и т. д.

Создавайте PDF-документы с помощью 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");

Вставка текста в PDF-документы с помощью JavaScript

JsPDF API помогает разработчикам JavaScript добавлять и отображать текст внутри документа PDF. Чтобы нарисовать текст, вам нужно определить имя шрифта. Мы можем выбрать из доступных шрифтов. Также возможно изменить семейство шрифтов и стиль шрифта. После этого мы можем определить размер шрифта, цвет текста и многое другое.

Добавить текст в существующий PDF с помощью 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
  }

Добавление графики в PDF-документы с помощью JavaScript

Библиотека JsPDF позволяет профессионалам JavaScript рисовать графику внутри документов PDF. Графика всегда повышает ценность контента. Во-первых, мы должны установить цвета заливки и обводки нарисованных фигур. Мы также можем установить ширину штриха. Каждая функция рисования формы принимает координаты центральной точки в качестве двух первых параметров (кроме треугольника). Они также принимают последний параметр стиля рисования. Мы можем нарисовать эллипс, передав два радиуса или окружность, передав только один радиус, треугольник, передав координаты каждого угла и многое другое.

Добавить изображение в PDF с помощью JavaScript

  // Add image to PDF
  var img = new Image()
  img.src = 'assets/sample.png'
  pdf.addImage(img, 'png', 10, 78, 12, 15)
 Русский