Skip to main content

VictoryAxis

info

For examples of VictoryAxis in action, visit the Chart Axis guide.

Inherited Props

Component Props


crossAxis

type: boolean

The crossAxis boolean prop specifies whether a given axis is intended to cross another axis. When this prop is true, zeroes will be removed from the array of ticks so that they do not clutter the origin of the chart.

note

When VictoryAxis is nested within VictoryChart, VictoryChart will determine a value for the crossAxis prop based on domain, but this prop may be overridden by supplying a crossAxis prop directly to the VictoryAxis child component.


domain

type: array[low, high] || { x: [low, high], y: [low, high] }

The domain prop describes the range of data the component will include. This prop can be given as an array of the minimum and maximum expected values of the data or as an object that specifies separate arrays for x and y. If this prop is not provided, a domain will be calculated from data, or other available information.

note

The x value supplied to the domain prop refers to the independent variable, and the y value refers to the dependent variable. This may cause confusion in horizontal charts, as the independent variable will corresponds to the y axis.


fixLabelOverlap

type: booleandefault: false

When true, this prop reduces the number of tick labels to fit the length of the axis. Labels are removed at approximately even intervals from the original array of labels. This feature only works well for labels that are approximately evenly spaced.


offsetX

type: number

The offsetX prop defines how far from the edge of its permitted area an axis should be offset in the x direction. If this prop is not given, the offset will be calculated based on font size, axis orientation, and label padding. When VictoryAxis is used with VictoryChart, VictoryChart will determine a value for offsetX that makes the axes line up correctly, but this value may be overridden by supplying an offsetX prop directly to the VictoryAxis child component.

note

The offsetX prop is relative to the edge corresponding to the orientation of the axis, e.g. the left edge when orientation="left".

Live View
Loading...
Live Editor

offsetY

type: number

The offsetY prop defines how far from the edge of its permitted area an axis should be offset in the y direction. If this prop is not given, the offset will be calculated based on font size, axis orientation, and label padding. When VictoryAxis is used with VictoryChart, VictoryChart will determine a value for offsetY that makes the axes line up correctly, but this value may be overridden by supplying an offsetY prop directly to the VictoryAxis child component.

note

The offsetY prop is relative to the edge corresponding to the orientation of the axis, e.g. the bottom edge when orientation="bottom".

Live View
Loading...
Live Editor

orientation

type: "top" | "bottom" | "left" | "right"

The orientation prop specifies the position and orientation of your axis. Options are "top", "bottom", "left", and "right".

Live View
Loading...
Live Editor

Like this project? You'll love working with us.

Contact us to learn more about our full range of services and offerings.

Learn More