New to Kendo UI for jQuery? Start a free 30-day trial

ValueAxis.majorTicks

configuration

The major ticks of the axis.

valueAxis.majorTicks

Object

<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
    type: "column",
    valueAxis: {
        majorTicks: {
            visible: true,
            size: 6,
            color: "blue"
        }
    },
    series: [{
        data: [10, 15, 8, 12]
    }]
});
</script>

valueAxis.majorTicks.color

String

The color of the value axis major ticks lines. Accepts a valid CSS color string, including hex and rgb.

Default: "black"

<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
    type: "column",
    valueAxis: {
        majorTicks: {
            visible: true,
            color: "#ff0000"
        }
    },
    series: [{
        data: [10, 15, 8, 12]
    }]
});
</script>

valueAxis.majorTicks.size

Number

The axis major tick size. This is the length of the line in pixels that is drawn to indicate the tick on the chart.

Default: 4

<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
    type: "column",
    valueAxis: {
        majorTicks: {
            visible: true,
            size: 8
        }
    },
    series: [{
        data: [10, 15, 8, 12]
    }]
});
</script>

valueAxis.majorTicks.skip

Number

The skip of the value axis major ticks.

Default: 0

<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
    type: "column",
    valueAxis: {
        majorTicks: {
            visible: true,
            skip: 1
        }
    },
    series: [{
        data: [10, 15, 8, 12, 20, 25]
    }]
});
</script>

valueAxis.majorTicks.step

Number

The step of the value axis major ticks.

Default: 1

<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
    type: "column",
    valueAxis: {
        majorTicks: {
            visible: true,
            step: 2
        }
    },
    series: [{
        data: [10, 15, 8, 12, 20, 25]
    }]
});
</script>

valueAxis.majorTicks.visible

Boolean

The visibility of the major ticks.

Default: true

<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
    type: "column",
    valueAxis: {
        majorTicks: {
            visible: false
        }
    },
    series: [{
        data: [10, 15, 8, 12]
    }]
});
</script>

valueAxis.majorTicks.width

Number

The width of the major ticks in pixels.

Default: 1

<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
    type: "column",
    valueAxis: {
        majorTicks: {
            visible: true,
            width: 3
        }
    },
    series: [{
        data: [10, 15, 8, 12]
    }]
});
</script>