navigator.categoryAxis.notes.data.iconObject
The icon of the note.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
navigator: {
categoryAxis: {
notes: {
data: [{
value: new Date("2012/01/15"),
icon: {
background: "red",
size: 15,
type: "circle"
},
text: "Note"
}]
}
}
},
dataSource: {
data: [
{ date: new Date("2012/01/01"), value: 1 },
{ date: new Date("2012/01/15"), value: 2 },
{ date: new Date("2012/02/01"), value: 3 }
]
},
dateField: "date",
valueField: "value"
});
</script>navigator.categoryAxis.notes.data.icon.backgroundString
The background color of the note icon.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
navigator: {
categoryAxis: {
notes: {
data: [{
value: new Date("2012/01/15"),
icon: {
background: "blue"
},
text: "Note"
}]
}
}
},
dataSource: {
data: [
{ date: new Date("2012/01/01"), value: 1 },
{ date: new Date("2012/01/15"), value: 2 },
{ date: new Date("2012/02/01"), value: 3 }
]
},
dateField: "date",
valueField: "value"
});
</script>navigator.categoryAxis.notes.data.icon.borderObject
The border of the icon.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
navigator: {
categoryAxis: {
notes: {
data: [{
value: new Date("2012/01/01"),
icon: {
border: {
width: 2,
color: "red"
}
}
}]
}
}
}
});
</script>navigator.categoryAxis.notes.data.icon.border.colorString
The border color of the icon.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
navigator: {
categoryAxis: {
notes: {
data: [{
value: new Date("2012/01/01"),
icon: {
border: {
color: "blue"
}
}
}]
}
}
}
});
</script>navigator.categoryAxis.notes.data.icon.border.widthNumber
The border width of the icon.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
navigator: {
categoryAxis: {
notes: {
data: [{
value: new Date("2012/01/01"),
icon: {
border: {
width: 3
}
}
}]
}
}
}
});
</script>navigator.categoryAxis.notes.data.icon.sizeNumber
The size of the icon.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
navigator: {
categoryAxis: {
notes: {
data: [{
value: new Date("2012/01/01"),
icon: {
size: 20
}
}]
}
}
}
});
</script>navigator.categoryAxis.notes.data.icon.typeString(default: "circle")
The icon shape.
The supported values are:
- "circle" - the marker shape is circle.
- "square" - the marker shape is square.
- "triangle" - the marker shape is triangle.
- "cross" - the marker shape is cross.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
navigator: {
categoryAxis: {
notes: {
data: [{
value: new Date("2012/01/01"),
icon: {
type: "square"
}
}]
}
}
}
});
</script>navigator.categoryAxis.notes.data.icon.visibleBoolean(default: "true")
The icon visibility.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
navigator: {
categoryAxis: {
notes: {
data: [{
value: new Date("2012/01/01"),
icon: {
visible: false
}
}]
}
}
}
});
</script>In this article