Skip to main content
All docs
V25.1
  • DxChart<T>.ResizePanesOnZoom Property

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

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.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.

    DxChart - Resize panes on zoom

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

    DxChart - Disable pane resizing

    See Also