javascript - Highcharts 图表栏 - 如何在图表中仅显示 HTML 表格中的一列？

Question

我得到了一个条形图，它从页面中的 HTML 表中提取数据。 http://www.highcharts.com/demo/column-parsed

如何只提取表中的一列，如果我们按照上面的示例，John 列...

这是构建串行的代码

// the categories
options.xAxis.categories = [];
$('tbody th', table).each( function(i) {
    options.xAxis.categories.push(this.innerHTML);
});

// the data series
options.series = [];
$('tr', table).each( function(i) {
    var tr = this;
    $('th, td', tr).each( function(j) {
        if (j > 0) { // skip first column
            if (i == 0) { // get the name and init the series
                options.series[j - 1] = {
                    name: this.innerHTML,
                    data: []
                };
            } else { // add values
                options.series[j - 1].data.push(parseFloat(this.innerHTML));
            }
        }
    });
});

我尝试只读取等于 2 的列，以便到达最后一列，但没有成功

if (j == 2) { ... }

希望有人能比我有更好的答案。什洛米。

Answer 1

试试这个:

options.series = [];
$('tr', table).each( function(i) {
    var tr = this;
    $('th, td', tr).each( function(j) {
        if (j == 2) { // get only column 2
            if (i == 0) { // get the name and init the series
                options.series[0] = {
                    name: this.innerHTML,
                    data: []
                };
            } else { // add values
                options.series[0].data.push(parseFloat(this.innerHTML));
            }
        }
    });
});

您需要检查j == 2，以便只获取第二列中的数据，然后当您创建options.series数组时，您需要使用 0 - Highcharts 至少需要 series[0]

中的数据

Working Example here