Question

我正在寻找一种基于下拉列表中的更改事件动态更新highcharts饼图中数据的方法。我看过几个例子，但我真的无法弄清楚为什么我不能让这个工作。这是我的整个代码，我将我的东西包装在一个函数中，所以我可以使用dropdownlist的Change（）事件调用该函数，但是我得到CRIPT438的错误：对象不支持属性或方法'setData'

function showClass(){
    var total = 0;
var options = {
        chart:{type:'pie',
        renderTo: 'ctl00_ContentPlaceHolder1_Overview1_tcAssetAllocation_body',
              events: {
                load: function(event) {
                $('.highcharts-legend-item').last().append('<br/><div style="width:220px"><hr/> <span style="float:left"> Total </span><span style="float:right">100%</span> </div>')                    
                }
              }
        },
        credits:{enabled: false},
        colors:[
            '#5485BC', '#AA8C30', '#5C9384', '#981A37', '#FCB319',     '#86A033', '#614931', '#00526F', '#594266', '#cb6828', '#aaaaab', '#a89375'
            ],
        title:{text: null},
        tooltip:{
            enabled: true,
            animation: true
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                animation: true,
                cursor: 'pointer',
                showInLegend: true,
                dataLabels: {
                    enabled: false,                        
                    formatter: function() {
                        return this.percentage.toFixed(2) + '%';
                    }
                }                                   
            }
        },
        legend: {
            enabled: true,
            layout: 'vertical',
            align: 'right',
            width: 220,
            verticalAlign: 'top',
            borderWidth: 0,
            useHTML: true,
            labelFormatter: function() {
            total += this.y;
                return '<div style="width:200px"><span style="float:left">' + this.name + '</span><span style="float:right">' + this.y + '%</span></div>';
            },
            title: {
                text: 'Primary',
                style: {
                    fontWeight: 'bold'
                }
            }
        },
        series: [{
            type: 'pie',
            data: [['Domestic Equity', 38.5],['International Equity', 26.85],['Other', 15.70],['Cash and Equivalents', 10.48],['Fixed Income', 8.48]]
        }]
}
var chart = new Highcharts.Chart(options);
$("#ctl00_ContentPlaceHolder1_Overview1_AccountList1_ddlAccounts").change(function(){
    var selVal = $("#ctl00_ContentPlaceHolder1_Overview1_AccountList1_ddlAccounts").val();
    if(selVal == '1124042'){
        chart.series[0].setData([['Domestic Equity', 18.5], ['International Equity', 46.85], ['Other', 5.70], ['Cash and Equivalents', 20.48], ['Fixed Income', 8.48]]);                }
});

}

是因为我嵌套在另一个函数中？所有的小提琴使用document.ready函数并正确加载调用document.ready（）中的函数，但是在变更事件中获取它正在弄乱我。任何帮助是极大的赞赏。非常感谢你， NickG

Answer 1

将对象options用作Highcharts API的一部分是错误的。找到该行：options.series[0].setData并更改为chart.series[0].setData()。然后删除创建新图表（您不需要 - 已创建图表）。

SetData（）无法处理Change Event HighCharts饼图

1 个答案: