blazor-devexpress-dot-blazor-dot-dxchartrangebarseries-3.md
Defines a range bar series.
Namespace : DevExpress.Blazor
Assembly : DevExpress.Blazor.v25.2.dll
NuGet Package : DevExpress.Blazor
public class DxChartRangeBarSeries<T, TArgument, TValue> :
DxChartRangeSeriesBase<T, TArgument, TValue>
| Name | Description |
|---|---|
| T |
The data type.
| | TArgument |
The argument type.
| | TValue |
The value type.
|
Range bar series display value ranges that correspond to argument values. The Chart selects the maximum and minimum bar limits from data points with an equal argument to specify start and end values.
Follow the steps below to create a range bar series:
DxChartRangeAreaSeries object to chart markup.@inject IWeatherSummaryDataProvider WeatherSummaryDataProvider
<DxChart @ref="@chart"
Data="@weatherForecasts"
Width="100%">
<DxChartTitle Text="Annual Temperature" />
<DxChartRangeBarSeries ValueField="@((DetailedWeatherSummary i) => i.AverageTemperatureF)"
ArgumentField="@(i => new DateTime(2000, i.Date.Month, 1))"
Name="New York"
Filter="@((DetailedWeatherSummary i) => i.City == "NEW YORK")" />
<DxChartRangeBarSeries ValueField="@((DetailedWeatherSummary i) => i.AverageTemperatureF)"
ArgumentField="@(i => new DateTime(2000, i.Date.Month, 1))"
Name="Los Angeles"
Filter="@((DetailedWeatherSummary i) => i.City == "LOS ANGELES")" />
<DxChartLegend HorizontalAlignment="HorizontalAlignment.Center"
VerticalAlignment="VerticalEdge.Bottom"
Position="RelativePosition.Outside" />
<DxChartValueAxis>
<DxChartAxisTitle Text="Temperature, °F" />
</DxChartValueAxis>
<DxChartArgumentAxis>
<DxChartAxisLabel Format="ChartElementFormat.Month" />
</DxChartArgumentAxis>
</DxChart>
@code {
IEnumerable<DetailedWeatherSummary> weatherForecasts;
protected override async Task OnInitializedAsync() {
weatherForecasts = await WeatherSummaryDataProvider.GetDataAsync();
}
}
Run Demo: DxChart - Range Bar Series
Object ComponentBase DxSettingsComponent<DevExpress.Blazor.Internal.IXYChartSeriesModel> DxComplexSettingsComponent<DxChartSeries, DevExpress.Blazor.Internal.IXYChartSeriesModel> DxChartSeries DxChartXYSeries<T, TArgument, TValue, TValue> DxChartRangeSeriesBase<T, TArgument, TValue> DxChartRangeBarSeries<T, TArgument, TValue>
See Also