Highchart 未正确显示饼图的 0 数据答案

【问题标题】：Highchart not showing 0 data correctly for pie chartHighchart 未正确显示饼图的 0 数据
【发布时间】：2018-01-06 14:36:27
【问题描述】：

我有一个包含多个字段的高图（饼图）（这里只添加了两个）。这给了我 0 值的问题。

条件如下：

如果我的第一个字段是 100%，则饼图会为另一个字段呈现 0% 的线条

参考这个小提琴：http://jsfiddle.net/rndmmuz6/4/

data: [{
        name: 'Check1',
        y: 100
    },
    {
        name: 'Check2',
        y: 0
    }]

但如果我的第二个字段是 100%，那么饼图不会为第一个字段呈现 0% 字段

参考这个小提琴：http://jsfiddle.net/rndmmuz6/3/

 data: [{
        name: 'Check1',
        y: 0
    },
    {
        name: 'Check2',
        y: 100
    }]

我希望这条线总是出现。

【问题讨论】：

您可以使用y: 0.01，直到问题得到解决。如果 y 为零，则在任何情况下都不应在技术上进行渲染。

标签： jquery charts highcharts pie-chart

【解决方案1】：

这个bug已经报告here，你可以这样使用borderWith : 0：

plotOptions: {
    pie: {
        allowPointSelect: true,
        cursor: 'pointer',
        dataLabels: {
            enabled: true,
            format: '<b>{point.name}</b>: {point.percentage:.1f} %',
            style: {
                color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
            }
        },
        borderWidth:0
    }
},

Fiddle

【讨论】：

border 0 删除了边框的出现，但我希望边框始终出现。尝试使用borderwidth 1。认为它会解决它。不过没用。

【解决方案2】：

破坏点的图形元素可能是一种解决方法：

    events: {
      load: function() {
        this.series[0].points.forEach(function(p) {
          if(!p.y) {
            p.graphic.destroy();
          }
        });
      }
    }

现场演示： http://jsfiddle.net/kkulig/ojd4wn3f/

【讨论】：

【解决方案3】：

我发现以下代码覆盖了 highchart 的 shapeArgs 以呈现线条

参考这个小提琴：http://jsfiddle.net/rndmmuz6/7/

Highcharts.wrap(Highcharts.seriesTypes.pie.prototype, 'drawPoints', function (proceed) {
    Highcharts.each(this.points, function (p) {
        if (p.shapeArgs) {
            p.shapeArgs.open = false;
        }
    });
    proceed.call(this);
});

【讨论】：