React Chart - valueAxis.title

Configures the axis title.

Selector: Title
Type:

ValueAxisTitle

The axis title is a short text displayed alongside the axis. Usually, the axis title shows units of measurement for values displayed by the axis. You can put any text in the axis title though.

DevExtreme HTML5 Charts AxisTitles

If you assign an object to the title property, specifying the text field of this object is necessary for the axis title to be displayed. Besides the object, the title property accepts a string, thus providing a shortcut for setting the axis title. Therefore, this:

title: 'Axis Title'

is the same as this:

title: {
    text: 'Axis Title'
}
See Also
  • commonAxisSettings.title - configures all axis titles in the UI component.

alignment

Aligns the axis title to the left, center, or right of the axis.

Type:

HorizontalAlignment

Default Value: 'center'

font

Specifies font properties for the axis title.

Selector: Font
Type:

Object

margin

Adds a pixel-measured empty space between the axis title and axis labels.

Type:

Number

Default Value: 6

DevExtreme HTML5 Charts AxesTitleMargin

text

Specifies the text of the axis title.

Type:

String

Default Value: undefined

textOverflow

Specifies what to do with the axis title when it overflows the allocated space after applying wordWrap: hide, truncate them and display an ellipsis, or do nothing.

Type:

TextOverflow

Default Value: 'ellipsis'

wordWrap

Specifies how to wrap the axis title if it does not fit into a single line.

Type:

WordWrap

Default Value: 'normal'

The following modes are available:

  • "normal"
    Text breaks only at allowed breakpoints (for example, a space between two words).

  • "breakWord"
    Words can be broken if there are no available breakpoints in the line.

  • "none"
    Word wrap is disabled.

If the text overflows the container even after word wrap, the UI component applies the textOverflow property.