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

DxChartAxisLabel.Overlap Property

Specifies how the chart displays overlapping axis labels.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

C#
[DefaultValue(ChartAxisLabelOverlap.Rotate)]
[Parameter]
public ChartAxisLabelOverlap Overlap { get; set; }

#Property Value

Type Default Description
ChartAxisLabelOverlap Rotate

A ChartAxisLabelOverlap enumeration value.

Available values:

Name Description
Rotate

Rotates axis labels at the angle specified by the RotationAngle property.

Stagger

Arranges axis labels in two rows in a staggered manner. Use the StaggeringSpacing property to specify the empty space between rows.

None

Leaves axis labels overlapped.

Hide

Hides overlapping axis labels.

#Remarks

Use the Overlap property to specify how the chart displays overlapping axis labels. Note that Hide and None values apply to both horizontal and vertical axes while Rotate and Stagger values apply to horizontal axes only.

The following example rotates labels of the horizontal axis at the specified angle:

razor
<DxChart Data="SalesData">
    <DxChartTitle Text="Sales amount" />
    <DxChartLegend Position="RelativePosition.Outside" />
    <DxChartArgumentAxis>
        <DxChartAxisTitle Text="Cities" />
        <DxChartAxisLabel Overlap="ChartAxisLabelOverlap.Rotate"
                          RotationAngle="90" />
    </DxChartArgumentAxis>
    @* ... *@
    <DxChartFullStackedBarSeries Name="2017"
                                 Filter="@((SaleInfo s) => s.Date.Year == 2017)"
                                 SummaryMethod="Enumerable.Sum"
                                 ArgumentField="@(s => s.City)"
                                 ValueField="@(s => s.Amount)" />
    <DxChartFullStackedBarSeries Name="2018"
                                 Filter="@((SaleInfo s) => s.Date.Year == 2018)"
                                 SummaryMethod="Enumerable.Sum"
                                 ArgumentField="@(s => s.City)"
                                 ValueField="@(s => s.Amount)" />
    <DxChartFullStackedBarSeries Name="2019"
                                 Filter="@((SaleInfo s) => s.Date.Year == 2019)"
                                 SummaryMethod="Enumerable.Sum"
                                 ArgumentField="@(s => s.City)"
                                 ValueField="@(s => s.Amount)" />
    <DxChartSplineSeries Name="Total"
                         SummaryMethod="Enumerable.Sum"
                         ArgumentField="@((SaleInfo s) => s.City)"
                         ValueField="@(s => s.Amount)"
                         Axis="TotalAxis" />
</DxChart>

DxChartAxisLabel - Overlap

Run Demo: Chart - Label Overlap

See Also