categoryAxis.rangeLabels.template String|Function
The template which renders the labels.
The fields which can be used in the template are:
- value - the category value
- dataItem - the data item, in case a field has been specified. If the category does not have a corresponding item in the data then an empty object will be passed.
- format - the default format of the label
- culture - the default culture (if set) on the label
- text - The default label text.
- index - The index of the label.
- count - The total number of rendered labels.
The text can be split into multiple lines by using line feed characters ("\n").
Example - set the category axis template as a string
<div id="chart"></div>
<script>
$("#chart").kendoChart({
categoryAxis: {
type: "date",
justified: true,
baseUnit: "days",
rangeLabels: {
template: "Year: #: value.getFullYear() #",
visible: true
},
labels: {
format: "M-d"
}
},
series: [{
type: 'line',
field: 'value',
categoryField: 'date',
data: [{
value: 1,
date: new Date("2012/01/01")
}, {
value: 2,
date: new Date("2012/01/04")
}, {
value: 3,
date: new Date("2012/01/07")
}]
}]
});
</script>
Example - set the category axis template as a function
<div id="chart"></div>
<script>
function rangeLabelTemplate(e) {
return "Year: " + e.value.getFullYear();
}
$("#chart").kendoChart({
categoryAxis: {
type: "date",
justified: true,
baseUnit: "days",
rangeLabels: {
template: rangeLabelTemplate,
visible: true
},
labels: {
format: "M-d"
}
},
series: [{
type: 'line',
field: 'value',
categoryField: 'date',
data: [{
value: 1,
date: new Date("2012/01/01")
}, {
value: 2,
date: new Date("2012/01/04")
}, {
value: 3,
date: new Date("2012/01/07")
}]
}]
});
</script>