How do I get which data is being grouped in AmChart pie - amcharts

Question

I'm using a bar chart yo show what is selected in a pie chart. The pie chart has "groupPercent": 5, and I can't change this. The problem is that, when I select te "Other" slice of the pie, it shows all the data in the bar chart.
Can I show only what is included in "Other" slice?
Can I get this data in JSon type or something like that?
I think the solution is near the pullOutSlice listener:
chart.addListener("pullOutSlice", function (event) {
if (event.dataItem.dataContext.data != undefined) {
var skus = event.dataItem.dataContext.data;
Thanks!
Some code:
var chart = AmCharts.makeChart("resellersalespiechart", {
"type": "pie",
"theme": "light",
"dataProvider": chartData,
"valueField": "qty",
"titleField": "reseller",
"labelText": "[[title]]: [[value]]",
"pullOutOnlyOne": true,
"groupPercent": 5,
"groupedTitle": "Otros",
"legend": {
"position": "bottom",
"marginRight": 20,
"autoMargins": false
}
});
// create column chart
var chart2 = AmCharts.makeChart("resellersalesbarchart", {
"type": "serial",
"theme": "light",
"pathToImages": "/lib/3/images/",
"autoMargins": false,
"marginLeft": 30,
"marginRight": 8,
"marginTop": 10,
"marginBottom": 26,
"titles": [{
"text": "Todos los resellers"
}],
"dataProvider": collectiveData,
"startDuration": 1,
"graphs": [{
"title": "projects",
"type": "column",
"fillAlphas": 0.8,
"valueField": "qty",
"balloonText": "[[category]]: <b>[[value]]</b>"
}],
"categoryField": "sku",
"categoryAxis": {
"gridPosition": "start",
"autoGridCount": false,
"gridCount": 12,
"labelFunction": function (valueText, serialDataItem, categoryAxis) {
return valueText;
},
"fontSize": 9
},
"valueAxes": [{
"integersOnly": true,
"fontSize": 9,
"labelFunction": function (value, valueText, valueAxis) {
if (value >= 1000) {
return (value / 1000) + "K";
} else {
return valueText;
}
}
}]
});
chart.addListener("pullInSlice", function (event) {
if (event.dataItem.dataContext.skus != undefined) {
chart1BarData = collectiveData;
chart1BarTitle = "Todos los resellers"
chart2.dataProvider = collectiveData;
chart2.titles[0].text = "Todos los resellers";
chart2.validateData();
chart2.animateAgain();
}
});
Chart example:
Image of the different views of charts

Answer 1

It appears that there isn't a direct way to do this. You'll need to loop through your dataProvider and aggregate the elements whose calculated percent value is under the groupPercent threshold then aggregate each element's sub array into a dataProvider array for your bar chart. For example:
if (event.dataItem.dataContext.skus != undefined) {
chart1BarData = collectiveData;
chart1BarTitle = "Todos los resellers"
chart2.dataProvider = collectiveData;
chart2.titles[0].text = "Todos los resellers";
chart2.validateData();
chart2.animateAgain();
}
else {
var sum = event.chart.chartData.reduce(function(accumulator, dataElement) {
return accumulator + dataElement.value;
}, 0);
var groupedElements = [];
event.chart.dataProvider.forEach(function(dataElement) {
if ((dataElement[event.chart.valueField] / sum) * 100 < event.chart.groupPercent) {
groupedElements.push(dataElement);
}
});
//aggregate/build chart dataProvider and assign to chart2 here
}