label

An object defining the label configuration options that are common for all axes in the dxChart widget.

Type: Object

Axis labels represent textual values for axis ticks, which are not visible by default. Use the label object's properties to set common label options for all axes simultaneously.

To set a common option for labels of a particular axis, use the label object within the argumentAxis or valueAxis configuration object. The values that are set individually override the corresponding common values.

Show Example:
jQuery

In this example, the labels of both the argument and value axes are rotated by 45 degrees.


                                    

                                    

alignment

Specifies the label's position relative to the tick (grid line).

Type: String
Default Value: undefined
Accepted Values: 'left' | 'center' | 'right'

Show Example:
jQuery

Use the drop-down list in the bottom to change the alignment option of axes labels.


                                    

                                    

font

Specifies font options for axis labels.

Type: Object

Show Example:
jQuery

In this example, the text of the axes labels is colored in black and enlarged up to the size of 15 pixels.


                                    

                                    

indentFromAxis

Specifies the spacing between an axis and its labels in pixels.

Type: Number
Default Value: 10

IdentFromAxis ChartJS

overlappingBehavior

Specifies the overlap resolving algorithm to be applied to axis labels.

Type: String|Object
Default Value: 'auto'
Accepted Values: object | 'auto' | 'ignore' | 'stagger' | 'rotate' | 'enlargeTickInterval'

When labels overlap each other, you can specify how these labels will be displayed by setting the overlappingBehavior option. The values accepted by this option depend on whether an axis is horizontal or vertical.

NOTE: By default, the argument axis is horizontal and the value axis is vertical. To swap the axes over, assign true to the rotated property.

For a vertical axis, the following values can be assigned to the overlappingBehavior option.

  • auto
    Resolve the label overlapping automatically.
  • ignore
    Leave the labels overlapped.
  • enlargeTickInterval
    Leave the labels as they are, but enlarge the axis tick intervals so that the labels do not overlap.

Horizontal axis' labels have two more modes. These modes are always applied no matter where there is a label overlap.

  • stagger
    Arrange labels in a staggered manner. The spacing between label rows will be 5 pixels.
  • rotate
    Rotate labels so that they are perpendicular to the axis.

To set custom spacing between staggered rows or the custom rotation angle for the 'stagger' and 'rotate' modes, assign an object to the overlappingBehavior configuration property. Set the object's mode property to the required mode, and set the staggeringSpacing or rotationAngle property to the required value.

Show Example:
jQuery

In the following example, the argument axis tick interval is intentionally set to a very small value so that the labels overlap each other. The overlap is resolved by rotating the labels by 80 degrees.


                                    

                                    

rotationAngle

Deprecated

Use the overlappingBehavior | rotationAngle option instead.

Specifies the angle that must be used to rotate the axis labels from their initial position.

Type: Number
Default Value: 0

staggered

Deprecated

Use the overlappingBehavior | mode option set to stagger instead.

Indicates whether or not to stagger horizontal axis labels in two rows.

Type: Boolean
Default Value: false

staggeringSpacing

Deprecated

Use the overlappingBehavior | staggeringSpacing option instead.

Specifies, in pixels, the spacing between staggered rows where horizontal axis labels are located.

Type: Number
Default Value: 5

StaggeringSpacing ChartJS

visible

Indicates whether or not axis labels are visible.

Type: Boolean
Default Value: false

Show Example:
jQuery

Use the check box in the bottom to change visibility of the axes labels.