1

前端往往需要将已有的数据展示结果,导出成PDF 文件, 支持将设计好的报表另存为 PDF, XLSX 及 HTML 文件。也可以不预览直接将报表导出。

在纯 JavaScript 应用中增加导出功能
需要将报表文件导出为哪种格式,就需要引入相关的js文件,如下:

<script src="https://cdn.grapecity.com/activereportsjs/2.latest/dist/ar-js-pdf.js"></script>
<script src="https://cdn.grapecity.com/activereportsjs/2.latest/dist/ar-js-xlsx.js"></script>
<script src="https://cdn.grapecity.com/activereportsjs/2.latest/dist/ar-js-html.js"></script>

如果需要在运行时设置一些导出属性,可以参考 导出 API 导出代码如下:

var viewer = new ActiveReports.Viewer("#viewer-host");
viewer.availableExports = ["pdf"];

ActiveReports.Viewer 的构造函数中第二个参数接受 ViewerOptions 对象 可以设置 ExportsSettings 属性。 您可以用来为每种支持的导出格式预设设置的默认值。

无预览直接导出
ActiveReportsJS 在PdfExport, HtmlExport XlsxExport 提供了 exportDocument 方法 ,以下代码演示了从报表加载,到运行,再到导出,下载导出文件:

import { Core, PdfExport } from "@grapecity/activereports";

const pdfExportSettings: PdfExport.PdfSettings = {
  title: "Test document",
  author: "GrapeCity",
  keywords: "export, report",
  subject: "Report",
  pdfVersion: "1.4",
};

const report = new Core.PageReport();
await report.load("/reports/text-only.rdlx-json");
const doc = await report.run();
const result = await PdfExport.exportDocument(doc, pdfExportSettings);
result.download("exportedreport.pdf");

LanLan_Guo
14 声望4 粉丝

研究报表已经7年有余,略懂一二。期望能够成为报表专家,为大家能够提供报表咨询服务。