レポートビューワー

概要

wijmo.viewerモジュールには、PdfViewerとReportViewerの2つのタイプのビューワーがあります。ReportViewerは、ComponentOne FlexReportからレポートを表示するために使用される軽量のビューワーです。Webアプリでレポートを表示するために使用します。

機能

ReportViewerを使用して、Webアプリまたはハイブリッドモバイルアプリで生成されたレポートを表示できます。

ドキュメントビューワーに期待される次の各機能がすぐに使用できます。

印刷機能とページ設定
レスポンシブビューワー
サムネイル
検索
改ページ設定
見出しマップ
全画面とサイズ変更のオプション
連続スクロールオプション
エクスポート

基本

ReportViewerの使用方法は、他のコントロールと同様です。マークアップでホスト要素を作成し、JavaScriptを使用してコントロールを作成します。ReportViewerを初期化するときに、レポートを表示するために次のプロパティを設定する必要があります。

serviceUrl：レポートサービスのURL。
filePath：サーバー上のFlexReport定義ファイル、SSRSレポートの完全パス。
reportName：FlexReport定義ファイルで定義されたレポート名。

例

<div id="reportViewer"></div>

let reportViewer = new viewer.ReportViewer('#reportViewer', {
        serviceUrl: 'https://developer.mescius.com/componentone/demos/aspnet/c1webapi/latest/api/report'
    });

ReportViewerコントロールには次のプロパティがあり、外観と動作を簡単にカスタマイズできます。

fullScreen：ビューワーが全画面モードかどうかを示します。
mouseMode：マウス動作を示します。
viewMode：ドキュメントページを表示する方法を示します。
zoomFactor：ドキュメントページを表示する現在のズーム倍率を示します。

例

reportViewer.fullScreen = true;
reportViewer.mouseMode = wijmo.viewer.MouseMode.MoveTool;
reportViewer.viewMode = wijmo.viewer.zoomMode.WholePage;

レポートの表示

ReportViewerコントロールは、複数のソースからレポートを表示できます。表示方法の概要は同じですが、サポートされるサーバーベースのレポートに接続する例を示します。

FlexReport

FlexReportは、ComponentOneライブラリに含まれる.NETレポートツールです。FlexReportのコンテンツを表示するには、ComponentOne Web APIレポートサービスを使用します。ComponentOne Web APIレポートサービスは、C1FlexReportを使用して、レポートをレンダリングおよびエクスポートします。設定方法の詳細については、FlexReports Web APIの設定を参照してください

ReportViewerでComponentOne WebApiに接続して「AlternateBackground」というFlexReportを表示する例を示します。

let reportViewer = new viewer.ReportViewer('#reportViewer', {
        serviceUrl: 'https://developer.mescius.com/componentone/demos/aspnet/c1webapi/latest/api/report',
        filePath: 'ReportsRoot/Formatting/AlternateBackground.flxr',
        reportName: 'AlternateBackground'
    });

ReportsRoot/は、指定されたレポートの場所を特定するためにサーバーに登録されたレポートプロバイダのキーです。「Formatting/AlternateBackground.flxr」は、レポートプロバイダが検索可能な場所にあるFlexReport定義ファイルの相対パスです。

reportNameは、FlexReport（.flxrファイル）の表示に必要な唯一のフィールドです

SSRSレポート

ReportViewerを使用してSSRSレポートを表示することもできます。それには、ComponentOne Web APIレポートサービスを使用する必要があります。プロセスは上と同じですが、サーバーはFlexReportではなくSSRSレポートを使用するように設定されます

ComponentOne Web APIレポートサービスは、C1SSRSDocumentSourceを使用してSSRSサーバーに接続し、SSRSレポートをレンダリングします。最初にサーバーからデータを取得し、レポートを目的の形式（通常はHTML5 SVG）に変換します。詳細については、ComponentOne Web APIレポートサービスを参照してください。

例：

let reportViewer = new viewer.ReportViewer('#reportViewer', {
        serviceUrl: 'https://developer.mescius.com/componentone/demos/aspnet/c1webapi/latest/api/report',
        filePath: 'c1ssrs/AdventureWorks/Company Sales'
    });

AdventureWorks/Company Salesは、サーバー上のレポートの完全パスです。

レポートビューワー
概要
機能
基本
例
例
レポートの表示
FlexReport
SSRSレポート
例：