Highcharts -- 隐藏零值而不使用 'null'

Question

我想用两个图表展示我想要实现的目标。

这个圆环图 (http://jsfiddle.net/b749uoto/) 有两个零值：一个用于 'Sony Ericsson'，另一个用于 'Nintendo'。代码漂亮地隐藏了这些值。连标签都没有出现。

负责在圆环图上隐藏零值的代码：

dataLabels: {
    formatter: function () {
    // display only if larger than 1
        return this.y > 1 ? '<b>' + this.point.name + ':</b> ' + this.y + '%'  : null;
    }
}

现在，这个 3d 条形图 (http://jsfiddle.net/arqL4ch2/1/) 与上面的圆环图具有相同的数据，但显示的都是零值。这张图表给我的第一印象是 'Sony Ericsson' 和 'Nintendo' 的值不为零。

我想在 3d 条形图（数据和标签）中隐藏这两家公司而不应用 'null' 值，因为这样做会在公司之间创建一个巨大的空白 space。

我尝试了一些我搜索过的建议，但没有用。我不是javascript高手

这可能吗？谢谢。

编辑 1：我删除了上面提到我正在使用 PHP 获取图表数据的一段，以避免获得 PHP 或特定于 SQL 的答案。我只想将图表 1 上的相同行为应用于图表 2。我坚信答案依赖于一些 Javascript-fu，而我没有。

编辑 2：为两个图表显示的代码太长。我删除了它，只留下圆环图中的 'hide zero values' 部分。

Answer 1

如果您只想为每个类别获取一个值，您可以在 PHP 代码中检查它，如果它的值为零，则不要将它添加到您的系列数据数组中。如果没有看到生成数据的代码，我就不能更具体了。如果您使用 SQL 查询来获取值，您可以只使用 return 非零条目吗？像这样的伪代码：

SELECT vendor, deviceCount
FROM devices
WHERE deviceCount > 0

我做了一些测试，您可以在图表本身中进行测试 - 只是需要修改一些代码。使用 chart.events.load 挂钩：

    events: {
        load: function () {
            var theChart = this;
            var theSeries = this.series;
            var removeIndex = [];
            var weight = 0;
            for (var key in theSeries) {
                var aSeries = theSeries[key];
                if (aSeries.data[0].y == 0) {
                    removeIndex.push(parseInt(key));
                }
            }
            for (var i in removeIndex) {
                var iRemove = removeIndex[i] - weight;
                theChart.series[iRemove].remove();
                weight = weight + 1;
            }
        }
    }

棘手的部分是 weight 项。当您删除索引项时，总索引会缩小。

其中大部分只是一个循环。这是一组非常冗长的代码，您可以将其压缩为更小的代码。此代码循环遍历图表中的每个系列，并假设每个系列只有一个点。然后检查该单点的值是否为 0。如果是，我们将该系列的索引添加到 removeIndex 数组。下一个循环遍历 removeIndex 数组并实际删除该系列。直播demo.

Answer 2

未显示 pieChart/DonutChart 的 0 值 dataLables。使用 formatter here are the docs

dataLabels: {
   enabled: true,
   formatter: function(){ // your condition/check
      if(this.y !== 0){
      return this.point.name + ' ' + this.y + '%'; 
      // returning name of label and percentage
      }
    }
}

Highcharts -- 隐藏零值而不使用 'null'

Highcharts -- Hide zero values without using 'null'

javascript

charts

hide

zero

highcharts