Skip to main content
All docs
V24.2

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

DxChart<T>.ResizePanesOnZoom Property

Specifies whether to resize chart panes when a user zooms or pans the chart.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

C#
[DefaultValue(true)]
[Parameter]
public bool ResizePanesOnZoom { get; set; }

#Property Value

Type Default Description
Boolean true

true to resize the chart pane and fit axis labels in the content area; false to disable pane resizing and truncate overflowing axis labels.

#Remarks

When users zoom, pan, or scroll the chart, axis labels can become longer. The content area available for axis labels remains the same and the chart resizes the pane to avoid truncated labels.

You can set the ResizePanesOnZoom property to false to disable pane resizing. In this case, the chart truncates axis labels that overflow the available content area:

razor
<DxChart @ref="@chart"
         T="DatePricePoint"
         Data="@UsdJpyData"
         ResizePanesOnZoom="false"
         Width="100%">
    <DxChartLegend Position="RelativePosition.Inside"
                   VerticalAlignment="VerticalEdge.Top"
                   HorizontalAlignment="HorizontalAlignment.Right" />
    <DxChartLineSeries T="DatePricePoint"
                       TArgument="DateTime"
                       TValue="double"
                       ArgumentField="i => i.DateTimeStamp"
                       ValueField="i => i.Price"
                       Name="USDJPY">
        <DxChartSeriesPoint Visible="false" />
        <DxChartAggregationSettings Enabled="true"
                                    Method="ChartAggregationMethod.Average" />
    </DxChartLineSeries>
    <DxChartArgumentAxis>
        <DxChartAxisRange StartValue="new DateTime(2020, 01, 01)"
                          EndValue="new DateTime(2021, 01, 29)" />
    </DxChartArgumentAxis>
    <DxChartZoomAndPanSettings ArgumentAxisZoomAndPanMode="ChartAxisZoomAndPanMode.Both" />
    <DxChartScrollBarSettings ArgumentAxisScrollBarVisible="true"
                              ArgumentAxisScrollBarPosition="ChartScrollBarPosition.Bottom" />
</DxChart>

@code {
    IEnumerable<DatePricePoint> UsdJpyData;
    @inject ICurrencyExchangeDataProvider UsdJpyDataProvider

    protected override async Task OnInitializedAsync() {
        UsdJpyData = await UsdJpyDataProvider.GetDataAsync();
    }
}

DxChart - Disable pane resizing

See Also