categoryAxis.notes.lineObject
The line of the notes.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
dataSource: {
data: [
{ date: "2012/01/01", open: 10, high: 15, low: 8, close: 12, volume: 1000 },
{ date: "2012/01/02", open: 12, high: 18, low: 10, close: 16, volume: 1500 }
]
},
dateField: "date",
categoryAxis: {
notes: {
data: [{ value: new Date("2012/01/01"), text: "Important date" }],
line: {
width: 3,
color: "red"
}
}
},
series: [{
type: "candlestick",
openField: "open",
highField: "high",
lowField: "low",
closeField: "close"
}]
});
</script>categoryAxis.notes.line.widthNumber
The line width of the notes.
Example - set the category axis notes line width
<div id="chart"></div>
<script>
$("#chart").kendoChart({
series: [{
data: [1, 2, 3]
}],
categoryAxis: {
notes: {
line: {
width: 4
},
data: [{ value: 1 }]
}
}
});
</script>categoryAxis.notes.line.colorString
The line color of the notes.
Example - set the category axis notes color width
<div id="chart"></div>
<script>
$("#chart").kendoChart({
series: [{
data: [1, 2, 3]
}],
categoryAxis: {
notes: {
line: {
color: "#aa00bb"
},
data: [{ value: 1 }]
}
}
});
</script>categoryAxis.notes.line.lengthNumber
The length of the connecting lines in pixels.
Example - set the category axis notes color width
<div id="chart"></div>
<script>
$("#chart").kendoChart({
series: [{
data: [1, 2, 3]
}],
categoryAxis: {
notes: {
line: {
length: 20
},
data: [{ value: 1 }]
}
}
});
</script>In this article