jQuery将其他计算数据点推送到HighChart系列

时间:2015-02-22 21:11:19

标签: javascript jquery highcharts

我正在尝试将数据点推送到HighCharts的数据系列数组。我已经开始使用标准饼图模板了。然后我添加了额外的$ .get语句来计算文件中的行数。 每个额外$ .get上的alert语句返回正确的行数,但数据点不会推送到该系列。 任何人都可以帮助我,我是JQuery的新手。感谢。

                $.get('piechart.csv', function(data) {
                    // Split the lines
                    var buttons
                    var lines = data.split('\n');
                    var series = {
                        data: []
                    };
                    // Iterate over the lines and add categories or series
                    $.each(lines, function(lineNo,line) {
                        var items = line.split(',');
                            series.data.push({
                                name: items[0],
                                y:parseFloat(items[1])
                            });
                    });


                    $.get('button0.txt', function(data) {
                        // Split the lines
                        var lines = data.split('\n');
                        series.data.push({
                            name: 'Power off',
                            y: (lines.length-1)
                        });
                        alert (lines.length-1);
                    });
                    $.get('button1.txt', function(data) {
                        // Split the lines
                        var lines = data.split('\n');
                        series.data.push({
                            name: 'Power on',
                            y: (lines.length-1)
                        });
                        alert (lines.length-1);
                    });

                    options.series.push(series);
                    // Create the chart
                    var chart = new Highcharts.Chart(options);
                });

1 个答案:

答案 0 :(得分:0)

数据点,我认为,被推送到系列,但问题在于,直到您已经创建并呈现图表实例之后才会发生这种情况。

撇开我在代码中没有看到options变量声明的事实,这表明可能存在潜伏的另一个错误(但我认为这只是一个错字?),问题在于HighCharts没有做任何事情来跟踪你传递它的初始系列,因此修改该系列不会影响图表。

您需要自己更新图表 - 例如,使用the addPoint method of the HighCharts series object。因此,在Ajax调用的成功回调中,您需要执行以下操作:

$.get('button0.txt', function(data) {
     // Split the lines
     var lines = data.split('\n'),
         chart = $('#container').highcharts();
     chart.series[0].addPoint({ 
           name: 'Power off', 
           y: lines.length-1 
     });
 });