valueAxis.titleObject
The title of the value axis.
Example
<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
type: "column",
valueAxis: {
title: {
text: "Values",
color: "blue",
font: "14px Arial"
}
},
series: [{
data: [10, 15, 8, 12]
}]
});
</script>valueAxis.title.backgroundString
The background color of the title. Any valid CSS color string will work here, including hex and rgb.
Example
<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
type: "column",
valueAxis: {
title: {
text: "Values",
background: "#f0f0f0"
}
},
series: [{
data: [10, 15, 8, 12]
}]
});
</script>valueAxis.title.borderObject
The border of the title.
Example
<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
type: "column",
valueAxis: {
title: {
text: "Values",
border: {
color: "blue",
width: 2,
dashType: "solid"
}
}
},
series: [{
data: [10, 15, 8, 12]
}]
});
</script>valueAxis.title.border.colorString(default: "black")
The color of the border.
Example
<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
type: "column",
valueAxis: {
title: {
text: "Values",
border: {
color: "#ff0000",
width: 1
}
}
},
series: [{
data: [10, 15, 8, 12]
}]
});
</script>valueAxis.title.border.dashTypeString(default: "solid")
The dash type of the border.
"solid"
Specifies a solid line.
"dot"
Specifies a line consisting of dots.
"dash"
Specifies a line consisting of dashes.
"longDash"
Specifies a line consisting of a repeating pattern of long-dash.
"dashDot"
Specifies a line consisting of a repeating pattern of dash-dot.
"longDashDot"
Specifies a line consisting of a repeating pattern of long-dash-dot.
"longDashDotDot"
Specifies a line consisting of a repeating pattern of long-dash-dot-dot.
Example
<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
type: "column",
valueAxis: {
title: {
text: "Values",
border: {
color: "blue",
width: 2,
dashType: "dash"
}
}
},
series: [{
data: [10, 15, 8, 12]
}]
});
</script>valueAxis.title.border.widthNumber(default: 0)
The width of the border.
Example
<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
type: "column",
valueAxis: {
title: {
text: "Values",
border: {
color: "green",
width: 3
}
}
},
series: [{
data: [10, 15, 8, 12]
}]
});
</script>valueAxis.title.colorString
The text color of the title. Any valid CSS color string will work here, including hex and rgb.
Example
<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
type: "column",
valueAxis: {
title: {
text: "Values",
color: "#ff6600"
}
},
series: [{
data: [10, 15, 8, 12]
}]
});
</script>valueAxis.title.fontString(default: "16px Arial,Helvetica,sans-serif")
The font style of the title.
Example
<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
type: "column",
valueAxis: {
title: {
text: "Values",
font: "18px Georgia, serif"
}
},
series: [{
data: [10, 15, 8, 12]
}]
});
</script>valueAxis.title.marginNumber | Object(default: 5)
The margin of the title.
Example
// sets the top, right, bottom and left margin to 3px.
margin: 3
// sets the top and left margin to 1px
// margin right and bottom are with 0px (by default)
margin: { top: 1, left: 1 }valueAxis.title.paddingNumber | Object(default: 0)
The padding of the title.
Example
// sets the top, right, bottom and left padding to 3px.
padding: 3
// sets the top and left padding to 1px
// padding right and bottom are with 0px (by default)
padding: { top: 1, left: 1 }valueAxis.title.positionString(default: "center")
The position of the title.
"top"
The axis title is positioned on the top (applicable to vertical axis).
"bottom"
The axis title is positioned on the bottom (applicable to vertical axis).
"left"
The axis title is positioned on the left (applicable to horizontal axis).
"right"
"The axis title is positioned on the right (applicable to horizontal axis).
"center"
"The axis title is positioned in the center.
Example
<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
type: "column",
valueAxis: {
title: {
text: "Values",
position: "top"
}
},
series: [{
data: [10, 15, 8, 12]
}]
});
</script>valueAxis.title.rotationNumber(default: 0)
The rotation angle of the title.
Example
<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
type: "column",
valueAxis: {
title: {
text: "Values",
rotation: 90
}
},
series: [{
data: [10, 15, 8, 12]
}]
});
</script>valueAxis.title.textString
The text of the title.
Example
<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
type: "column",
valueAxis: {
title: {
text: "Custom Title"
}
},
series: [{
data: [10, 15, 8, 12]
}]
});
</script>valueAxis.title.visibleBoolean(default: true)
The visibility of the title.
Example
<div id="sparkline"></div>
<script>
$("#sparkline").kendoSparkline({
type: "column",
valueAxis: {
title: {
text: "Values",
visible: false
}
},
series: [{
data: [10, 15, 8, 12]
}]
});
</script>