Skip to main content

ChartScrollBarPosition Enum

Lists values that specify the scroll bar’s position.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v22.1.dll


public enum ChartScrollBarPosition


Name Description

Places the scroll bar below the chart.


Places the scroll bar to the left of the chart.


Places the scroll bar to the right of the chart.


Places the scroll bar above the chart.

Related API Members

The following properties accept/return ChartScrollBarPosition values:


When the chart displays the argument axis horizontally, use the Top and Bottom values to specify the scroll bar position.

If you set the DxChart.Rotated property to true, the chart displays the argument axis vertically. In this case, use the Right and Left values to specify the scroll bar position.

The code below does the following:

  • Enables zoom and pan.
  • Adds a scroll bar to the chart’s argument axis.
  • Sets the scroll bar’s position to Top.
@using Chart.Data

<DxChart Data="@SalesData">
    <DxChartLineSeries Name="2017"
                        Filter="@((SaleInfo s) => s.Date.Year == 2017)"
                        ArgumentField="@(s => s.Date)"
                        ValueField="@(s => s.Amount)">
        <DxChartAggregationSettings Enabled="true" Method="ChartAggregationMethod.Sum" />
    <DxChartZoomAndPanSettings ArgumentAxisZoomAndPanMode="ChartAxisZoomAndPanMode.Both"
                               ValueAxisZoomAndPanMode="ChartAxisZoomAndPanMode.Pan" />
    <DxChartScrollBarSettings ArgumentAxisScrollBarVisible="true"
                              ArgumentAxisScrollBarPosition="ChartScrollBarPosition.Top" />

@code {
    IEnumerable<SaleInfo> SalesData;

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

Scroll bar

Run Demo: Charts - Zoom and Pan

See Also