DxChartStepLineSeries<T, TArgument, TValue> Class

Defines a step line series.

Assembly: DevExpress.Blazor.v25.2.dll

Declaration

public class DxChartStepLineSeries<T, TArgument, TValue> :
    DxChartLineSeriesBase<T, TArgument, TValue>

Type Parameters

Name	Description
T	The data type.
TArgument	The argument type.
TValue	The value type.

Remarks

Step line series display data as points joined by horizontal and vertical line segments that form a step-like pattern. Follow the steps below to create a step line series:

Use the DxChart.Data property to specify a data source.
Add a DxChartStepLineSeries object to chart markup.
Use series ArgumentField and ValueField properties to specify data source fields that supply arguments and values for chart points.
Optional. Specify series Filter and SummaryMethod properties to filter and aggregate series values.

The following example filters data by region. It also groups arguments by date and calculates aggregate values using the Enumerable.Sum method. For a sample data source, refer to our GitHub repository.

DxChart - Step Line Series

@inject ISalesInfoDataProvider Sales
<DxChart Data="chartsData"
         LabelOverlap = "ChartLabelOverlap.Hide"
         Width="100%">
    <DxChartStepLineSeries Name="North America"
                         T="SaleInfo"
                         TArgument="DateTime"
                         TValue="int"
                         ArgumentField="si => new DateTime(si.Date.Year, si.Date.Month, 1)"
                         ValueField="si => si.Amount"
                         SummaryMethod="Enumerable.Sum"
                         Filter='si => si.Region == "North America" '
                         HoverMode="ChartContinuousSeriesHoverMode.None">
        <DxChartSeriesPoint Visible=showSeriesPointMarkers
                            HoverMode="ChartSeriesPointHoverMode.None" />
        <DxChartSeriesLabel Visible=showSeriesLabels
                            ValueFormat="ChartElementFormat.Thousands(1)" />
    </DxChartStepLineSeries>
    <DxChartLegend Position="RelativePosition.Outside"
                   HorizontalAlignment="HorizontalAlignment.Right" />
@* ... *@
</DxChart>
@* ... *@
@code {
    IEnumerable<SaleInfo> chartsData;
    bool showSeriesPointMarkers = false;
    bool showSeriesLabels = false;

    protected override async Task OnInitializedAsync() {
        chartsData = await Sales.GetSalesAsync();
    }
}

Run Demo: DxChart - Step Line Series