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.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[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:

<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();
    }
}