帳票の表現力を高めるレポートコントロールの紹介
ActiveReportsJSには、帳票の表現力を高めるさまざまなレポートコントロールが用意されています。以下ではそれらのいくつかを抜粋して、概要を紹介していきます。より詳細な利用方法はレポートコントロールの公式ドキュメントを参照してください。
表、チャート
Tableレポートコントロールで表を、Chartレポートコントロールでチャートを、それぞれ帳票に表示できます（図14）。このサンプルでは、第1四半期～第4四半期の売り上げを年ごと、部署ごとに記述したJSONファイルをデータソースとして、表とチャートを表示します。データソースの詳細はサンプルコードを参照してください。
表を表示するには、Tableレポートコントロールを利用します。Tableレポートコントロールはヘッダー行、詳細行、フッター行より構成されており、ヘッダー行とフッター行は1行だけ、詳細行はデータの個数分だけ帳票に表示されます。それぞれのセルに、表示させたいデータ項目や文言を設定します。
チャートを表示するには、Chartレポートコントロールを利用します。カテゴリフィールドにカテゴリ（ここでは年）、データフィールドにデータ（ここでは四半期ごとの売り上げ）を設定します。
バーコード
Barcodeレポートコントロールを利用すると、QRコードなどのさまざまなバーコードを帳票に埋め込んで表示できます（図17）。
バーコードを表示するには、Barcodeレポートコントロールの「種類」にバーコードの種類、「値」にバーコードに反映する値をそれぞれ設定します。「種類」はQRコードのほか、郵便物に付与されるカスタマバーコードや、コンビニで利用されるバーコードなど、28種類の規格から選択できます。
TextBoxコントロールの日本語テキスト対応機能
文字列を配置するTextBoxレポートコントロールには、縦書きや禁則処理など、日本語固有の機能に対応したテキスト機能が備わっています（図19）。
均等割り付けを行うには、TextBoxレポートコントロールで「テキスト」の「水平方向の整列」を「Justify」、「均等割付」を「DistributeAllLines」にします。また、縦書きにするには「インターナショナル」の「文字表記の方向」を「tb-rl」にします。詳細はサンプルコードの帳票ファイル（p007-text.rdlx-json）を参照してください。
帳票のエクスポート
ActiveReportsJSでは、帳票をPDF・Excel・HTMLにエクスポートする機能が利用できます。ここでは、PDFにエクスポートする図20の例を紹介します。
エクスポート機能はプラグインとして提供されます。index.htmlのheadタグ内で、リスト5の通りプラグインのJavaScriptファイル（ar-js-pdf.js）を参照します。なお、ExcelエクスポートやHTMLエクスポートを利用する場合、対応するプラグインファイル（ar-js-xlsx.js、ar-js-html.js）を同様に参照します。
<script src="activereportsjs/scripts/ar-js-pdf.js"></script>
プラグインが参照されると、ビューワの左側に表示されるサイドバーに、エクスポートボタンが自動的に表示されます（図21）。
PDFで日本語を正しく表示するには、日本語フォントを設定する必要があります。サンプルでは、fonts/fontConfig.jsonファイルにIPAゴシックとIPA明朝のフォントを設定しています。詳細はサンプルコードを参照してください。
［補足］JavaScriptの実装でPDFを出力
ビューワが自動的に表示するエクスポートボタンを利用せず、PDF出力の処理をJavaScriptで実装することもできます。詳細は、サンプルコード（p008a-pdf-manual）を参照してください。
まとめ
本記事では、グレープシティの帳票出力ライブラリー「ActiveReportsJS」を紹介しました。GUIで帳票を作成できる帳票デザイナと、Webページに帳票を表示するビューワを組み合わせて、表現力豊かな帳票を、サーバーの処理に依存せずWebブラウザーのJavaScript処理だけで作成できます。
