React データ集計

Ignite UI for React IgrCategoryChart コントロールのデータ集計機能を使用すると、チャート内のデータを XAxis の一意の値でグループ化し、それらのグループをソートすることができます。次に、YAxis の範囲に反映され、シリーズにカーソルを合わせるとツールチップに表示される集計を適用できます。

React データ集計の例

次の例は、XAxis の Country メンバーごとにグループ化する縦棒チャートを示しており、各データ項目内の他のプロパティ (Product、MonthName、Year など) に変更して販売データを集計できます。また、グループ化されたプロパティを望ましい順序で取得するために、概要とソートのオプションも利用できます。

initialSummaries と groupSorts のドロップダウン内にある短縮関数は、割り当てたプロパティに基づいて正しい結果が得られるように適用されていることに注意してください (例: Sum(sales) as Sales | Sales Desc)。

 <IgrCategoryChart
    dataSource={this.state.salesData}
    initialGroups="country"
    initialSummaries="Sum(sales) as Sales"
    groupSorts="Sales Desc"/>

API リファレンス

以下は上記のセクションで説明した API メンバーのリストです。

• initialSortDescriptions
• initialSorts
• sortDescriptions
• initialGroups
• initialGroupDescriptions
• groupDescriptions
• initialSummaries
• initialSummaryDescriptions
• summaryDescriptions
• initialGroupSortDescriptions
• groupSorts
• groupSortDescriptions

[!Note] includedProperties | excludedProperties を使用する場合、チャート集計は機能しません。チャートのこれらのプロパティは非集計データ用です。データを集計しようとすると、これらのプロパティは使用できなくなります。うまくいかない理由は、描画のためにチャートに渡されたコレクションを集計により置き換えるためです。include/exclude プロパティは、そのデータの in/out プロパティをフィルターするように設計されており、それらのプロパティは新しい集計されたコレクションには存在しません。