「ActiveReportsJS」のTablixコントロールで、複数データのクロス集計にトライ
「ActiveReportsJS」ではじめるフロントエンド帳票開発 第3回
ダウンロード サンプルファイル (136.0 KB)
フィルタでデータを絞り込み
前回記事で紹介したTable同様、Tablixレポートコントロールでも、特定の条件でデータを絞り込むフィルタ機能が利用できます。図19では、性別と携帯電話会社のフィルタを利用して、性別が女性、携帯電話会社がA社とB社のデータを絞り込み表示しています。
Tablixでのフィルタ利用法を説明します。まず、フィルタの指定内容を、ActiveReportsJSの「パラメータ」機能で作成します。パラメータ設定方法の詳細は、前回記事を参照してください。図19のサンプルでは、表4の設定を行って、性別と携帯電話会社、2種類のパラメータを作成します。
| No. | 設定項目 | 設定内容（性別） | 設定内容（携帯電話会社） |
|---|---|---|---|
| 1 | 名前 | paramSex | paramCarrier |
| 2 | ダイアログの表示文字列 | 性別 | 携帯電話会社 |
| 3 | データタイプ | String | ← |
| 4 | 複数の値を許可する | はい | ← |
| 5 | 使用できる値 | クエリから値を取得 | ← |
| 6 | データセットの名前 | データセット1 | ← |
| 7 | 値フィールド | sex | carrier |
| 8 | ラベルフィールド | sex | carrier |
表4の通り設定したパラメータを、Tablixの「フィルタ」に設定します（図20）。
以上の設定を行った後で帳票を表示すると、図19の通りフィルタ機能が利用できるようになります。
まとめ
本記事では、ActiveReportsJSのTablixレポートコントロールを利用して、複数データ項目を掛け合わせて集計するクロス集計の表を作成する方法を説明しました。Tablixの集計機能を利用することで、開発者は集計処理を実装することなく、集計するデータをTablixに渡すだけで複雑なクロス集計を行えます。
次回は、データからチャートを帳票に表示できる、ActiveReportsJSのチャート機能について説明していきます。
参考資料
この記事は参考になりましたか？
既に会員の方はを行ってください。
- 「ActiveReportsJS」ではじめるフロントエンド帳票開発連載記事一覧
- この記事の著者
-
WINGSプロジェクト 吉川 英一（ヨシカワ エイイチ）
＜WINGSプロジェクトについて＞有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ（代表 山田祥寛）。主にWeb開発分野の書籍／記事執筆、翻訳、講演等を幅広く手がける。 2026年時点での登録メンバは約50名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂きたい。著書、記事多数。 RSS X: @WingsPro_info（公式）、@WingsPro_info/wings（メンバーリスト） Facebook
※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です
-
山田 祥寛（ヤマダ ヨシヒロ）
静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for Visual Studio and Development Technologies。執筆コミュニティ「WINGSプロジェクト」代表。主な著書に「独習シリーズ（Java・C#・Python・PHP・Ruby・JSP＆サーブレットなど）」「速習シリーズ（ASP.NET Core・Vue.js・React・TypeScript・ECMAScript、Laravelなど）」「改訂3版JavaScript本格入門」「これからはじめるLaravel実践入門」「はじめてのAndroidアプリ開発 Kotlin編 」他、著書多数。
※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です
【AD】本記事の内容は記事掲載開始時点のものです 企画・制作 株式会社翔泳社
この記事は参考になりましたか？
この記事をシェア
