Show a Total Sum for Stacked Chart Series
Environment
| Product | Progress® Kendo UI® Chart for jQuery |
| Operating System | Windows 10 64bit |
| Visual Studio Version | Visual Studio 2017 |
| Preferred Language | JavaScript |
Description
How can I place a label with the stack total on top of column or bar Chart series?
Solution
Starting with the 2016 R3 release, a stackValue field is available in the label template, the series visual, and the event arguments.
It is possible to use this configuration to display the cumulative point value for stacked series.
<div id="chart"></div>
<script>
$(function(){
$("#chart").kendoChart({
dataSource:{
data:[{
a: 22,
b: 11,
c: 33
},{
a: 2,
b: 1,
c: 3
}]
},
seriesDefaults: {
type: "column",
stack: true
},
series: [{
field: "a",
name: "a"
},{
field: "b",
name: "b"
},{
field: "c",
name: "c",
labels: {
template: "#= stackValue #",
visible: true
}
}]
});
});
</script>