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

State.categoryAxis

configuration

The category axis configuration options.

state.categoryAxis

Array

Default: (required)

<div id="chart-wizard"></div>
<script>
$("#chart-wizard").kendoChartWizard({
    state: {
        categoryAxis: {
            labels: {
                color: "#333",
                font: "12px Arial",
                rotation: 45
            },
            title: {
                text: "Categories",
                color: "#666"
            }
        }
    }
});
</script>

state.categoryAxis.categories

Array

The category names. The chart will create a category for every item of the array.

<div id="chart-wizard"></div>
<script>
$("#chart-wizard").kendoChartWizard({
    state: {
        categoryAxis: {
            categories: ["Q1", "Q2", "Q3", "Q4"]
        }
    }
});
</script>

state.categoryAxis.labels

Object

The axis labels configuration.

<div id="chart-wizard"></div>
<script>
$("#chart-wizard").kendoChartWizard({
    state: {
        categoryAxis: {
            labels: {
                color: "#666",
                font: "11px Arial",
                format: "{0:MMM}",
                rotation: 30,
                visible: true
            }
        }
    }
});
</script>

state.categoryAxis.reverse

Boolean

The reverse option of the axis.

Default: false

<div id="chart-wizard"></div>
<script>
$("#chart-wizard").kendoChartWizard({
    state: {
        categoryAxis: {
            reverse: true
        }
    }
});
</script>

state.categoryAxis.title