Sort Stacked Area Line Or Column Chart Category Order By Category Total
Visualization Challenge
Understand the rank of each category by total or total contribution in stacked visualizations.
Solution
Edit the order of stacked bar or area charts by the total sum of each category.
Viz Examples
Widget without order assigned to categories

Widget after order assigned to categories


Code Widget Custom Javascript Code
SyntaxEditor Code Snippet
SyntaxEditor Code Snippet
widget.on("processresult",function(w,args){
var originalSeries = args.result.series;
var dict = {};
var counter = 0;
function getSum(total, num) {
return total + num;
}
originalSeries.forEach(
function(i){
var mySeries = [];
i.data.forEach(function(datapoint){mySeries.push(datapoint["y"])});
var total = mySeries.reduce(getSum);
dict[counter] = total;
counter++;
})
var items = Object.keys(dict).map(function(key) {
return [key, dict[key]];
});
var OrderArray = items.sort(function(first, second) {
return second[1] - first[1];
});
var newSeries = [];
for (var i = 0; i < originalSeries.length; i++){
var SeriesIndex = parseInt(OrderArray[i][0]);
newSeries.push(originalSeries[SeriesIndex]);
};
counter = 0;
newSeries.forEach(function(item){
if (counter.toString().length == 1) {
counter = "0" + counter;
}
item["sortData"] = counter.toString() + item["sortData"];
counter++;
});
args.result.series = newSeries;
});
Updated 03-02-2023
intapiuser
Admin
Joined December 15, 2022