折れ線図をType="ChartType.Line"設定してレンダリングします。折れ線図は時間経過の傾向を示すのに最適で、同じような図表形式DataverseChart同じAggregateDataverseChartDataSourceと利便性の要素が適用されます。
年ごとの平均推定機会価値(評価別、ホット/ウォーム/コールド)。ポイントをクリックすると詳細が見られます。
SeriesDateGrouping同じ日付列を異なる時間間隔で複数のシリーズに分割するように設定してください。例えば、SeriesDateGrouping = ChartDateGrouping.Year GroupByDateGrouping = ChartDateGrouping.Monthは、X軸に月を持つ1行を生成します。
import {
AggregateDataverseChartDataSource,
AggregateType,
ChartDateGrouping,
ChartType,
} from '@powerportalspro/react-charts';
import { DataverseChart } from '@powerportalspro/react-fluent';
import { useMemo } from 'react';
export function MyChart() {
const source = useMemo(
() =>
new AggregateDataverseChartDataSource({
tableName: 'opportunity',
groupByColumn: 'actualclosedate',
groupByDateGrouping: ChartDateGrouping.Month,
seriesDateGrouping: ChartDateGrouping.Year,
aggregateColumn: 'estimatedvalue',
aggregate: AggregateType.Sum,
}),
[],
);
return (
<DataverseChart
dataSource={source}
type={ChartType.Line}
title="月ごとの収益(前年比)"
yAxisPrefix="$"
/>
);
}<DataverseChart Source="_source"
Type="ChartType.Line"
Title="月ごとの収益(前年比)"
YAxisPrefix="$" />
@code {
private readonly AggregateDataverseChartDataSource _source = new()
{
TableName = "opportunity",
GroupByColumn = "actualclosedate",
GroupByDateGrouping = ChartDateGrouping.Month,
SeriesDateGrouping = ChartDateGrouping.Year,
AggregateColumn = "estimatedvalue",
Aggregate = AggregateType.Sum,
};
}月ごとの総推定収益で、各年ごとに別々の行として示します。季節のパターンを年を超えて比較しましょう。
関連項目