보고서 내보내기

지원되는 내보내기 방법

ActiveReportsJS에는 보고서를 PDF, XLSX 및 HTML 문서로 내보낼 수 있는 기능이 포함되어 있습니다. 보고서 뷰어 UI에는 사용자가 출력 형식을 선택하고, 내보낸 문서 속성을 설정할 수 있는, 구성 가능한 내보내기 세로 막대가 포함되어 있습니다. 또한 ActiveReportsJS API에서는 뷰어에서 로드하지 않고 보고서를 내보내는 데 사용할 수 있는 메서드를 제공합니다.

순수 JavaScript 응용 프로그램에서 보고서 뷰어 내보내기 세로 막대 구성

응용 프로그램에는 해당 내보내기 형식을 내보내기 세로 막대에서 사용할 수 있도록 설정하는 ar-js-pdf.js, ar-js-xlsx.js 및 ar-js-html.js 파일의 코드가 포함되어야 합니다. 이렇게 하려면 CDN에서 호스팅하는 코드에 참조를 추가하는 것이 가장 쉬운 방법입니다. 예를 들어 다음과 같습니다.

<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>

런타임에 사용 가능한 내보내기 형식을 구성해야 하는 경우 availableExports 속성을 사용하여 구성할 수 있습니다. 예를 들어 다음 코드는 보고서 뷰어의 인스턴스를 초기화하고 내보내기 세로 막대에서만 PDF 형식을 허용합니다.

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

ActiveReports.Viewer 구성자의 두 번째 인수는 ViewerOptions 개체를 수락합니다. 이 개체에는 지원되는 각 내보내기 형식에 대한 설정의 기본값을 미리 설정하는 데 사용할 수 있는 ExportsSettings 속성이 있을 수 있습니다. ExportsSettings 속성 사용에 대한 자세한 내용은 내보내기 설정 페이지를 참조하십시오. 순수 JavaScript 응용 프로그램에서 ActiveReportsJS 뷰어를 사용하는 방법에 대한 자세한 내용은 순수 JavaScript 문서를 확인하십시오.

Angular 응용 프로그램에서 보고서 뷰어 내보내기 세로 막대 구성

Angular 응용 프로그램에 ActiveReportsJS 서비스를 사용하는 방법에 대한 자세한 내용은 Angular 컴포넌트 문서를 참조하십시오. Angular 뷰어 컴포넌트의 availableExports 속성을 사용하여 런타임에 사용 가능한 내보내기 형식을 설정하고, exportsSettings 속성을 사용하여 내보내기 설정을 미리 설정할 수 있습니다. exportsSettings 속성 사용에 대한 자세한 내용은 내보내기 설정 페이지를 참조하십시오.

React 응용 프로그램에서 보고서 뷰어 내보내기 세로 막대 사용

코드가 @grapecity/activereports 패키지에서 임의의 유형을 가져오는 경우 React용 ActiveReportsJS 보고서 뷰어 컴포넌트는 내보내기 세로 막대를 자동으로 사용합니다. React 뷰어 컴포넌트의 availableExports 속성을 사용하여 런타임에 사용 가능한 내보내기 형식을 설정하고, exportsSettings 속성을 사용하여 내보내기 설정을 미리 설정할 수 있습니다. exportsSettings 속성 사용에 대한 자세한 내용은 내보내기 설정 페이지를 참조하십시오. 자세한 내용은 React 컴포넌트 문서를 참조하십시오.

Vue 응용 프로그램에서 보고서 뷰어 내보내기 세로 막대 사용

코드가 @grapecity/activereports 패키지에서 임의의 유형을 가져오는 경우, Vue용 ActiveReportsJS 보고서 뷰어 컴포넌트는 내보내기 세로 막대를 자동으로 사용합니다. Vue 뷰어 컴포넌트의 availableExports 속성을 사용하면 런타임에 사용 가능한 내보내기 형식을 설정할 수 있고, exportsSettings 속성을 사용하면 내보내기 설정을 미리 설정할 수 있습니다. exportsSettings 속성 사용에 대한 자세한 내용은 내보내기 설정 페이지를 참조하십시오. 자세한 내용은 Vue 컴포넌트 문서를 참조하십시오.

뷰어에서 보고서를 로드하지 않고 보고서 내보내기

ActiveReportsJS API를 사용하면 보고서를 뷰어에서 로드하지 않고 지원되는 형식으로 내보낼 수 있습니다. PdfExport, HtmlExport 및 XlsxExport 유형은 각 형식에 대한 exportDocument 메서드를 제공합니다. 다음은 보고서를 로드 및 실행하여 PDF 문서로 내보낸 다음 다운로드하는 코드 예제입니다.

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");

내보내기 설정 페이지에서 각 내보내기 유형에 대해 지원되는 설정 목록을 확인할 수 있습니다.