I am trying to do a stacked bar chart. In the tooltip i want to show the running total of stacked bar. Is there any way i can do that ?
e.g. in the below example. First stack consist of two parts 4.83 and 0.09, i want to show in the tooltip (4.83+0.09=4.92) but could not find a way to do that. Which property should i use in the tooltip, currently its like that:
template: "#= series.name # : #= series.data #"
<div id="example">
<div class="demo-section k-content">
<div id="chart"></div>
</div>
<script>
function createBarChart() {
$("#chart").kendoChart({
legend: {
visible: false
},
seriesDefaults: {
type: "bar"
},
series: [{
name: "Target",
stack: "Target & Stretch",
data: [4.83]
}, {
name: "Stretch",
stack: "Target & Stretch",
data: [0.09]
}, {
name: "Actual",
stack: "Actual",
data: [4.92]
}],
seriesColors: ["#cd1533", "#000000", "#00ff00"],
valueAxis: {
min: 0,
labels: {
template: "#= kendo.format('{0:N}', value ) # "
},
line: {
visible: true
}
},
categoryAxis: {
categories: ["Target & Actual"],
labels:{
visible: false
},
majorGridLines: {
visible: false
}
},
tooltip: {
visible: true,
template: "#= series.name # : #= series.data #"
}
});
}
$(document).ready(createBarChart);
$(document).bind("kendo:skinChange", createBarChart);
</script>
</div>