Question

我想展示一下我试图用两张图表来实现的目标。

这个圆环图（http://jsfiddle.net/b749uoto/）有两个零值：一个用于索尼爱立信＆＃39;还有另一个任天堂＆＃39;。代码精美地隐藏了这些值。甚至没有出现标签。

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

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

现在，这个三维条形图（http://jsfiddle.net/arqL4ch2/1/）与上面的圆环图具有相同的数据，但都显示了零值。我总是从这张图表中得到第一印象，索尼爱立信＆＃39;和任天堂＆＃39;值不等于零。

我想将这两家公司从三维条形图（数据和标签）中隐藏起来，而不是应用＆＃39; null＆＃39;价值观，因为这样做可以创造公司之间巨大的空白空间。

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

这可能吗？谢谢。

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

编辑2：两个图表显示的代码太长。我删除了它，只留下了隐藏零值＆＃39;部分来自圆环图。

Answer 1

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

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 - 隐藏零值而不使用＆＃39; null＆＃39;

2 个答案: