Repository navigation
Chart: Update DiscretePointsAggregation Demo Desc. #36249
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Changes from all commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change | ||||
|---|---|---|---|---|---|---|
| @@ -1,22 +1,15 @@ | ||||||
| To [aggregate](/Documentation/Guide/UI_Components/Chart/Data_Aggregation/) points on discrete axes, follow the steps below. | ||||||
| <!--split--> | ||||||
|
|
||||||
| 1. Enable aggregation. | ||||||
| You can enable data aggregation for the following series: | ||||||
| Multiple data points within a data set can be attributed to the same category. DevExtreme Chart can [aggregate](/Documentation/Guide/UI_Components/Chart/Data_Aggregation/) such points and display one value per category in each series. | ||||||
|
|
||||||
| - Individual series | ||||||
| Assign `true` to the [series](/Documentation/ApiReference/UI_Components/dxChart/Configuration/series/).[aggregation](/Documentation/ApiReference/UI_Components/dxChart/Configuration/series/aggregation/).[enabled](/Documentation/ApiReference/UI_Components/dxChart/Configuration/series/aggregation/#enabled) property. | ||||||
| This demo displays monthly crude oil production in six US states. The Chart creates a series for each year, so every series contains twelve values per state. Without aggregation, the Chart draws these values as twelve overlapping bars in the same position. Aggregation replaces them with a single bar. | ||||||
|
|
||||||
| - All series of a specific type | ||||||
| Assign `true` to the `aggregaion.enabled` property that belongs to the configuration object of a [specific series type](/Documentation/ApiReference/UI_Components/dxChart/Series_Types/). | ||||||
|
|
||||||
| - All series in the Chart | ||||||
| Assign `true` to the [commonSeriesSettings](/Documentation/ApiReference/UI_Components/dxChart/Configuration/commonSeriesSettings/).[aggregation](/Documentation/ApiReference/UI_Components/dxChart/Configuration/commonSeriesSettings/aggregation/).[enabled](/Documentation/ApiReference/UI_Components/dxChart/Configuration/commonSeriesSettings/aggregation/#enabled) property. | ||||||
| <!--split--> | ||||||
|
|
||||||
| Individual series aggregation settings have priority over common aggregation settings in the component. For example, you can enable aggregation for all series and disable it for a specific series. | ||||||
| Use the options below the Chart to modify aggregation settings as follows: | ||||||
|
|
||||||
| In this demo, data aggregation is enabled for all series. | ||||||
| - **Aggregation enabled** | ||||||
| Clear this checkbox to display source data. All twelve monthly bars overlap and look like a single bar as tall as the highest monthly value. The tooltip displays the month for the bar under the mouse pointer, and this month changes as you move the pointer along the bar. | ||||||
|
Contributor
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. How about this?
Suggested change
Contributor
Author
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. That is not quite accurate. Each bar you see in this demo is in fact 12 overlapping bars (one for each month of the year). Tooltips are displayed for individual months only (when aggregation is disabled) |
||||||
|
|
||||||
| 2. Specify an aggregation [method](/Documentation/ApiReference/UI_Components/dxChart/Configuration/commonSeriesSettings/aggregation/#method) (optional). | ||||||
| In this demo, the `sum` method is used. | ||||||
| - **Method** | ||||||
| Select the aggregation method used to display bars: average, sum, or minimum. Gray bars in the background display the monthly maximum for comparison when average or minimum is selected. | ||||||
|
|
||||||
| You can apply common aggregation settings to all series. Activate [aggregation](/Documentation/ApiReference/UI_Components/dxChart/Configuration/commonSeriesSettings/aggregation/).[enabled](/Documentation/ApiReference/UI_Components/dxChart/Configuration/commonSeriesSettings/aggregation/#enabled) in [commonSeriesSettings](/Documentation/ApiReference/UI_Components/dxChart/Configuration/commonSeriesSettings/) and specify an aggregation [method](/Documentation/ApiReference/UI_Components/dxChart/Configuration/commonSeriesSettings/aggregation/#method). Individual [series](/Documentation/ApiReference/UI_Components/dxChart/Configuration/series/aggregation/) settings override these common settings. In this demo, the gray series always use the *"max"* aggregation method. | ||||||
|
Contributor
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
Suggested change
Contributor
Author
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. The "gray series" here refers to the background bar, should we not describe it here?
Contributor
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. We've mentioned this in the previous paragraph. I don't think we should repeat the idea. |
||||||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Currently, sounds like a bug. Correct me if my edit is wrong.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
"Overlapping" is the correct word here, "Stacked" bars are a separate concept: https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxChart/Series_Types/StackedBarSeries/