scale majorTickInterval

Specifies an interval between major ticks.

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

Major ticks are those that are accompanied by labels that display corresponding scale values. Use this property to divide the scale by major ticks in a specified interval. If this property is not set, major ticks are automatically arranged so that labels do not overlap each other.

In the case of a numeric scale, assign a numeric value to this property. If the scale is of the date-time type, assign one of the predefined string values. To set an interval to several days, hours etc., assign an object with the corresponding field specified (days, hours or another field). Note that this object should contain only one of the fields described in this section.

NOTE: The specified tick interval can be changed internally if its value leads to label overlap. If you need to prohibit automatic tick arrangement in this situation, set the scale's useTicksAutoArrangement property to false.

Show Example:
jQuery

In this example, the majorTickInterval option is set to 'week'.

<div id="rangeSelectorContainer" style="height: 160px"></div>
$(function () {
    $("#rangeSelectorContainer").dxRangeSelector({
        scale: {
            startValue: new Date(2012, 2, 4),
            endValue: new Date(2012, 3, 10),
            majorTickInterval: 'week'
        }
    });
});

days

Specifies the count in days between the scale's major ticks.

Type: Number

This property is used for a date-time scale.

Show Example:
jQuery

In this example, the majorTickInterval option is set to 7 days.

<div id="rangeSelectorContainer" style="height: 160px"></div>
$(function () {
    $("#rangeSelectorContainer").dxRangeSelector({
        scale: {
            startValue: new Date(2012, 2, 5),
            endValue: new Date(2012, 3, 10),
            majorTickInterval: { days: 7 }
        }
    });
});

hours

Specifies the count in hours between the scale's major ticks.

Type: Number

This property is used for a date-time scale.

Show Example:
jQuery

In this example, the majorTickInterval option is set to 24 hours.

<div id="rangeSelectorContainer" style="height: 160px"></div>
$(function () {
    $("#rangeSelectorContainer").dxRangeSelector({
        scale: {
            startValue: new Date(2012, 2, 5),
            endValue: new Date(2012, 2, 10),
            majorTickInterval: { hours: 24 }
        }
    });
});

milliseconds

Specifies the count in milliseconds between the scale's major ticks.

Type: Number

This property is used for a date-time scale.

Show Example:
jQuery

In this example, the majorTickInterval option is set to 100 milliseconds.

<div id="rangeSelectorContainer" style="height: 160px"></div>
$(function () {
    $("#rangeSelectorContainer").dxRangeSelector({
        scale: {
            startValue: new Date(0),
            endValue: new Date(1000),
            majorTickInterval: { milliseconds: 100 }
        }
    });
});

minutes

Specifies the count in minutes between the scale's major ticks.

Type: Number

This property is used for a date-time scale.

Show Example:
jQuery

In this example, the majorTickInterval option is set to 10 minutes.

<div id="rangeSelectorContainer" style="height: 160px"></div>
$(function () {
    $("#rangeSelectorContainer").dxRangeSelector({
        scale: {
            startValue: new Date(2012, 2, 5, 12, 00),
            endValue: new Date(2012, 2, 5, 13, 00),
            majorTickInterval: { minutes: 10 }
        }
    });
});

months

Specifies the count in months between the scale's major ticks.

Type: Number

This property is used for a date-time scale.

Show Example:
jQuery

In this example, the majorTickInterval option is set to 3 months.

<div id="rangeSelectorContainer" style="height: 160px"></div>
$(function () {
    $("#rangeSelectorContainer").dxRangeSelector({
        scale: {
            startValue: new Date(2010, 0),
            endValue: new Date(2013, 0),
            majorTickInterval: { months: 3 }
        }
    });
});

seconds

Specifies the count in seconds between the scale's major ticks.

Type: Number

This property is used for a date-time scale.

Show Example:
jQuery

In this example, the majorTickInterval option is set to 30 seconds.

<div id="rangeSelectorContainer" style="height: 160px"></div>
$(function () {
    $("#rangeSelectorContainer").dxRangeSelector({
        scale: {
            startValue: new Date(2012, 2, 5, 12, 00),
            endValue: new Date(2012, 2, 5, 12, 10),
            majorTickInterval: { seconds: 30 }
        }
    });
});

years

Specifies the count in years between the scale's major ticks.

Type: Number

This property is used for a date-time scale.

Show Example:
jQuery

In this example, the majorTickInterval option is set to 5 years.

<div id="rangeSelectorContainer" style="height: 160px"></div>
$(function () {
    $("#rangeSelectorContainer").dxRangeSelector({
        scale: {
            startValue: new Date(1992, 0),
            endValue: new Date(2012, 0),
            majorTickInterval: { years: 5 }
        }
    });
});