valueAxis.crosshairObject
The crosshair configuration options.
valueAxis.crosshair.colorString
The color of the crosshair.
valueAxis.crosshair.widthNumber
The width of the crosshair.
valueAxis.crosshair.opacityNumber
The opacity of the crosshair.
valueAxis.crosshair.dashTypeNumber
The dash type of the crosshair.
valueAxis.crosshair.visibleBoolean
(default: false)
The dash type of the crosshair.
valueAxis.crosshair.tooltipObject
The crosshair tooltip configuration options.
valueAxis.crosshair.tooltip.backgroundString
The background color of the tooltip.
valueAxis.crosshair.tooltip.borderObject
The border configuration options.
valueAxis.crosshair.tooltip.border.colorString
(default: "black")
The color of the border.
valueAxis.crosshair.tooltip.border.widthNumber
(default: 0)
The width of the border.
valueAxis.crosshair.tooltip.colorString
The text color of the tooltip.
valueAxis.crosshair.tooltip.fontString
(default: "12px Arial,Helvetica,sans-serif")
The tooltip font.
valueAxis.crosshair.tooltip.formatString
valueAxis.crosshair.tooltip.paddingNumber|Object
The padding of the tooltip.
Example
pseudo
// sets the top, right, bottom and left padding to 3px.
padding: 3
// sets the top and left padding to 1px
// right and bottom padding are left at their default values
padding: { top: 1, left: 1 }
valueAxis.crosshair.tooltip.templateString|Function
The tooltip template. Template variables:
- value - the point value (either a number or an object)
Example
<div id="chart"></div>
<script>
// chart initialization
$("#chart").kendoChart({
title: {
text: "My Chart Title"
},
series: [{
name: "Series 1",
data: [200, 450, 300, 125]
}],
categoryAxis: {
categories: [2000, 2001, 2002, 2003]
},
valueAxis: {
crosshair: {
visible: true,
tooltip: {
visible: true,
template: "value: #= value #"
}
}
}
});
</script>
valueAxis.crosshair.tooltip.visibleBoolean
(default: false)
A value indicating if the tooltip should be displayed.
In this article