React Chart - argumentAxis.tickInterval

Specifies the interval between major ticks.

Type:

Number

|

Object

|

String

Default Value: undefined
Accepted Values: 'day' | 'hour' | 'millisecond' | 'minute' | 'month' | 'quarter' | 'second' | 'week' | 'year'

Major ticks divide an axis into segments, thus improving the viewer's perception of visualized data. Major ticks are generated automatically, unless the tickInterval option is set.

If the axis displays numbers, assign a number to this option. If the axis displays date-time values, assign one of the accepted string values or an object to this option. The object should contain only one of all fields described in this section, for example:

jQuery
JavaScript
$(function() {
    $("#chartContainer").dxChart({
        // ...
        argumentAxis: {
            // ...
            tickInterval: { days: 5 }
        }
    });
});
Angular
HTML
TypeScript
<dx-chart ... >
    <dxo-argument-axis ... >
        <dxo-tick-interval [days]="5"></dxo-tick-interval>
    </dxo-argument-axis>
</dx-chart>
import { DxChartModule } from "devextreme-angular";
// ...
export class AppComponent {
    // ...
}
@NgModule({
    imports: [
        // ...
        DxChartModule
    ],
    // ...
})

When you use an axis of the "logarithmic" type, ticks are generated on a base of powers. For example, assuming that the logarithm base is 10 and the tick interval is 1, ticks are generated at 10-2, 10-1, 100, 101, 102, 103, etc. If the tick interval becomes 2, ticks are generated at 10-1, 101, 103, etc.

When using the widget as an ASP.NET MVC Control, specify this option using the VizTimeInterval enum. This enum accepts the same values, but they start with an upper-case letter, for example, 'day' becomes Day.

See Also
  • argumentAxis.tick - configures the appearance of major ticks.
  • argumentAxis.minorTickInterval - specifies the interval between minor ticks.

days

Specifies the time interval measured in days. Available only for an axis/scale displaying date-time values.

Type:

Number

hours

Specifies the time interval measured in hours. Available only for an axis/scale displaying date-time values.

Type:

Number

milliseconds

Specifies the time interval measured in milliseconds. Available only for an axis/scale displaying date-time values.

Type:

Number

minutes

Specifies the time interval measured in minutes. Available only for an axis/scale displaying date-time values.

Type:

Number

months

Specifies the time interval measured in months. Available only for an axis/scale displaying date-time values.

Type:

Number

quarters

Specifies the time interval measured in quarters. Available only for an axis/scale displaying date-time values.

Type:

Number

seconds

Specifies the time interval measured in seconds. Available only for an axis/scale displaying date-time values.

Type:

Number

weeks

Specifies the time interval measured in weeks. Available only for an axis/scale displaying date-time values.

Type:

Number

years

Specifies the time interval measured in years. Available only for an axis/scale displaying date-time values.

Type:

Number