Label Overlap

Population by Country 2023

DevExpress Blazor Chart component allows you to define how axis labels are arranged. When axis labels overlap, use the Overlap property to rearrange them. You can select one of the following options:

  • Hide — Hide overlapping axis labels.
  • None — Leave axis labels overlapped.
  • Rotate — Rotate axis labels at the angle specified by the RotationAngle property.
  • Stagger — Stagger axis labels across two rows. Use the StaggeringSpacing property to specify the space between rows.

In this demo, you can use the drop-down menu to rearrange overlapping axis labels.

Text Overflow and Word Wrap

Pizza Shop Complaints

DevExpress Blazor Chart component allows you to reserve an area for an axis and its labels (the PlaceholderSize property). When axis labels overflow this region, you can use one of the following options to define how to display such labels:

  • Text Overflow — the TextOverflow property specifies how axis labels are truncated. Ellipsis, Hide, and None options are available.
  • Word Wrap — the WordWrap property specifies how axis labels are wrapped. BreakWord, Normal, and None options are available.

In this demo, you can specify content area size for the argument axis and use drop-down menus to specify the display options for axis labels.