Question

我正在尝试制作一份报告，直观地显示收集的数据，以表示从大学发送给学生的电子邮件广告系列的响应率。

在最高级别，饼图显示已收集了多少回复，在第二级，它显示收集的回复是什么，可以是

接受采访邀请
请求替代日期/时间
拒绝采访

如果面试被拒绝，我们会抓住导致学生做出选择的内容。

我在这里以及amCharts网站上关于如何向下钻取单个图层的一些指南，这可以成功地工作，如下面的小提琴所示。

我正在努力的是如何添加所需的额外级别的向下钻取。

amCharts网站声明您可以向下钻取多个级别，但是我很难实现这个目标

    var piedata = [{"response": "Not Yet Responded",
                "count": 151 
                  }, {
                "response": "Responded",
                "count": 259,
                "subdata": [
                    {"response": "Interview Re-Arranged", "count":28},
                    {"response": "Confirmed Attending", "count":213},
                    {"response": "Withdrawn Prior To Interview", "count":18, "subdata":[
                        {"response": "Course(s) Not Suitable", "count":1},
                        {"response": "Financial Issues", "count":1},
                        {"response": "Other College - Not Listed", "count":1},
                        {"response": "Other College - Local", "count":3},
                        {"response": "Transport Issues", "count":1},
                        {"response": "Unknown", "count":11}]} 
                ]}];

function generateChartDataPie () {
    var chartDataPie = [];
    for (var i = 0; i < piedata.length; i++) {
        if (i== selected) {
            for (var x = 0; x < piedata[i].subdata.length; x++) {
                chartDataPie.push({
                    response: piedata[i].subdata[x].response,
                    count: piedata[i].subdata[x].count,
                    pulled: true
                });
            }
        }
        else {
            chartDataPie.push({
                response: piedata[i].response,
                count: piedata[i].count,
                id: i
            });
        }
    }
    return chartDataPie;
}
var selected;

AmCharts.ready(function() {
    // PIE CHART
    chart = new AmCharts.AmPieChart(AmCharts.themes.light);
    chart.dataProvider = generateChartDataPie();
    chart.titleField = "response";
    chart.valueField = "count";
    chart.outlineColor = "#FFFFFF";
    chart.outlineAlpha = 0.8;
    chart.outlineThickness = 2;
    chart.pulledField = "pulled";
    chart.labelsEnabled = false;

    // ADD TITLE
    chart.addTitle("Click a slice to see the details");

    // AN EVENT TO HANDLE SLICE CLICKS
    chart.addListener("clickSlice", function (event) {
        if (event.dataItem.dataContext.id != undefined) {
            selected = event.dataItem.dataContext.id;
        }
        else {
            selected = undefined;
        }
        chart.dataProvider = generateChartDataPie();
        chart.validateData();
    });

    // WRITE
    chart.write("chartdiv1");
});

Answer 1

更改功能已完成多级下钻，更新功能如下：

function generateChartDataPie () {
    var chartDataPie = [];

        if (selected) {
            for (var x = 0; x < selected.length; x++) {
                chartDataPie.push({
                    response: selected[x].response,
                    count: selected[x].count,
                    pulled: true,
                    subdata: selected[x].subdata
                });
            }
        }
        else {
            chartDataPie = piedata;
        }
    return chartDataPie;
}

amCharts多级深度挖掘

1 个答案: