如何获取在 AmChart 饼图中分组的数据

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

我使用的是条形图,您可以在饼图中显示 select 的内容。饼图有 "groupPercent": 5,,我无法更改它。 问题是,当我 select te "Other" 切片时,它在条形图中显示了所有数据。

  1. 我可以只显示 "Other" 切片中包含的内容吗?
  2. 我可以获取 JSon 类型或类似类型的数据吗?

我认为解决方案就在 pullOutSlice 侦听器附近:

chart.addListener("pullOutSlice", function (event) {
        if (event.dataItem.dataContext.data != undefined) {
            var skus = event.dataItem.dataContext.data;

谢谢!

一些代码:

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();
        }
    });

图表示例: Image of the different views of charts

似乎没有直接的方法可以做到这一点。您需要遍历 dataProvider 并聚合其计算百分比值低于 groupPercent 阈值的元素,然后将每个元素的子数组聚合到条形图的 dataProvider 数组中。例如:

    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
    }