Highcharts

Question

如果可以将小部分与其他部分组合在一起，Pie/Donut 图表将更易于阅读。我想将此功能添加到 zeppelin-highcharts

在这个例子中 Donut Chart。 Safari 有一小部分无法阅读。最好把它分组到 "Safari Other Versions"

{
    name: 'Safari versions',
    categories: ['Safari v5.0', 'Safari v5.1', 'Safari v6.1', 
                 'Safari v6.2', 'Safari v7.0', 'Safari v7.1', 'Safari v8.0'],
    data: [0.3, 0.42, 0.29, 0.17, 0.26, 0.77, 2.56],
}

我想像这样将小部分分组给其他人jsfiddle

{
    name: 'Safari versions',
    categories: ['Safari Other Versions', 'Safari v8.0'],
    data: [2.21, 2.56],
}

我浏览了 Highcharts API 文档，但我还没有找到任何可以启用此功能的配置。

如何在 Highcharts 中实现此功能？

Answer 1

我认为您可以在制作图表之前添加过滤功能。您还可以在加载事件回调函数上过滤数据。

在这里你可以找到回调函数中代码过滤数据的简单示例：

var groupSmallData = function(series, number) {
    var groupValue = 0,
        newData = [];
    Highcharts.each(series.data, function(p) {
        if (p.y < number) {
          groupValue += p.y;
        } else {
          newData.push([p.name, p.y])
        }
    });
    newData.push(['others', groupValue]);
    series.setData(newData)
}

在这里您可以找到它如何工作的实例：http://jsfiddle.net/b33ynvaq/1/

Highcharts - Pie/Donut 图表组小部分

Highcharts - Pie/Donut Chart group small portion

pie-chart

donut-chart