React Hierarchical Grid エクスポート

Ignite UI for React Hierarchical Grid は、Grid Toolbar Exporter コンポーネントを介してデータエクスポート機能を提供します。表示されたデータを Excel、CSV、または PDF 形式でエクスポートできます。Excel エクスポートは、フィルタリングやソートなどの機能をサポートする MS Excel テーブル形式を使用します。エクスポートを有効にするには、IgrGridToolbarExporter をグリッドのツールバー内に配置します。デフォルトでは、すべてのエクスポート形式が有効になっています。

React エクスポートの例

複数列ヘッダーグリッドのエクスポート

定義された複数列ヘッダーを使用して IgrHierarchicalGrid をエクスポートできます。すべてのヘッダーは、IgrHierarchicalGrid に表示されるときに、エクスポートされた Excel ファイルに反映されます。エクスポートされたデータから定義された複数列ヘッダーを除外する場合は、ExporterOption IgnoreMultiColumnHeaders を true に設定できます。

[!Note] Excel テーブルは複数の列ヘッダーをサポートしていないため、エクスポートされた IgrHierarchicalGrid はテーブルとしてフォーマットされません。

[!Note] IgrGridToolbarExporter は、エンドユーザーが使用できるエクスポート形式を制御する方法も示すように構成されています。ツールバーのエクスポーターオプションを使用して、Excel、CSV、または PDF ボタンを切り替えます。

exportExcel、exportCsv、exportPdf

固定された列ヘッダーを使用してグリッドをエクスポートする

デフォルトでは、Excel エクスポーターサービスは、スクロール可能な (固定されていない) 列ヘッダーを使用してグリッドをエクスポートします。多くのシナリオでは、エクスポートされた Excel ファイルの上部にすべてのヘッダーを固定し、ユーザーがレコードをスクロールしても常に表示されるようにしたい場合があります。これを実現するには、ExporterOption FreezeHeaders を true に設定します。

[!Note] PDF エクスポートには、ドキュメントの上部に列ヘッダー行が自動的に含まれるため、読者がファイルを開いたり印刷したりしても同じコンテキストが保持されます。

function exportEventFreezeHeaders(args: IgrExporterEventArgs) {
    args.detail.options.freezeHeaders = true;
  }

<IgrGridToolbar>
  <IgrGridToolbarActions>
    <IgrGridToolbarExporter onExportStarted={exportEventFreezeHeaders}></IgrGridToolbarExporter>
  </IgrGridToolbarActions>
</IgrGridToolbar>

既知の問題と制限

制限	説明
階層レベル	Excel エクスポーターサービスは、最大 8 レベルの階層を作成できます。
ワークシートの最大サイズ	Excel でサポートされているワークシートの最大サイズは、1,048,576 行 x 16,384 列です。
ピン固定列された列のエクスポート	エクスポートされた Excel ファイルでは、ピン固定列は固定されませんが、グリッドに表示されるのと同じ順序で表示されます。
幅の広い PDF レイアウト	非常に幅の広い Grid は、PDF の列がページに収まるように縮小されることがあります。ドキュメントを読みやすく保つために、エクスポートする前に列幅を適用するか、優先度の低いフィールドを非表示にしてください。

API リファレンス

IgrHierarchicalGrid

その他のリソース

コミュニティに参加して新しいアイデアをご提案ください。