Example of undefined in React Chart Component


This example shows the smart label placement for the chart axis labels.

More Details...


In this example, you can see how the axis labels are smartly arranged when they overlap with each other using the LabelIntersectAction property in the axis.

Chart supports the following by which can be set using labelIntersectAction property.

  • Hide - Hide the label when it intersect.
  • Trim - Trim the label when it intersect.
  • Wrap - Wrap the label when it intersect.
  • MultipleRows - Arrange the label in multiple row when it intersect.
  • Rotate45 - Rotate the label to 45 degree when it intersect.
  • Rotate90 - Rotate the label to 90 degree when it intersect.
  • None - Shows all the labels.

Chart supports three types of edge labels placement which can be set using edgeLabelPlacement property.

  • None - No action will be performed.
  • Hide - Edge label will be hidden .
  • Shift - Shifts the edge labels.

More information on the smart axis labels can be found in this documentation section.