1. 产品
  2.   PDF格式
  3.   JavaScript
  4.   JSPDF
 
  

通过开源 JavaScript API 生成 PDF

用于创建和转换 PDF 文件的开源 JavaScript 库，通过 JavaScript 将图形和文本添加到 PDF。

JSPDF 是一个用于 PDF 文档创建和管理的开源 HTML5 客户端解决方案。它支持报告、证书、票务等强大功能。由于 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>

通过 JavaScript 库生成 PDF 文档

JsPDF 提供了生成 PDF 文档以及在 JavaScript 应用程序中修改的功能。您可以轻松地生成 PDF 文档并向其添加新页面。您可以在创建新文档时定义文档方向、单位和默认页面格式。生成 PDF 后，您可以轻松地添加新页面、插入图像等。

通过 JavaScript 创建 PDF 文档

 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 将文本插入 PDF 文档

JsPDF API 有助于 JavaScript 开发人员在 PDF 文档中添加和显示文本。要绘制文本，您需要定义字体名称。我们可以从可用的字体中进行选择。也可以更改字体系列和字体样式。之后，我们可以定义字体大小、文本颜色等。

使用 JavaScript 将文本添加到现有 PDF

  //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 将图形添加到 PDF 文档

JsPDF 库使 JavaScript 专业人士能够在 PDF 文档中绘制图形。图形总是为内容增加更多价值。首先，我们必须设置绘制的形状填充和描边颜色。我们还可以设置笔画宽度。每个形状绘制函数都将中心点坐标作为两个第一个参数（三角形除外）。它们还采用最后一个参数绘图样式。我们可以画一个椭圆，通过两个半径或圆，只通过一个半径，一个三角形，通过每个角的坐标等等。

使用 JavaScript 将图像添加到 PDF

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