Question

我发现两个图表彼此相邻显示非常具有挑战性，因此两个图表区域的长度应相等。

但由于某些传说中甚至存在差距，我想我可以在我的（抱歉，CSV）数据中提供零或null作为值，然后隐藏相应的图例。我试过了legendFormatter，它可以隐藏文字但是没有隐藏颜色方块。

隐藏，我的意思是留空格代替空值。

你可以帮忙吗？我对jQuery很新。

Firefox 40
IE  20
Chrome  15
Edge    10
Safari  5
null    0
Other   7
Text browsers   3

这个小提琴是一个开始。我用一些修正液隐藏了传说。

http://jsfiddle.net/3zqeqq38/

Answer 1

您可以包装Legend.prototype.renderItem方法，并决定是否应该显示图例项目。片段：

(function(H) {
  H.wrap(H.Legend.prototype, 'renderItem', function (p, item) {
    p.call(this, item);

    if(item.y === 0) {
      item.legendGroup.hide();
    } else {
      item.legendGroup.show();
    }
  });
})(Highcharts)

演示：http://jsfiddle.net/e48xa51L/

Answer 2

您应该能够从<pre>标记中删除这些值。这样的事情应该有效：

$('#chart-sectors-csv').text($('#chart-sectors-csv').text().replace(/null(.*)0/g,""));

$('#chart-drivers-csv').text($('#chart-drivers-csv').text().replace(/null(.*)0/g,""));

这将删除这些值，您可能仍希望对图表大小进行一些格式化。

您可以在此处看到它：http://jsfiddle.net/igor_9000/v0yyajsj/4/

希望有所帮助！

隐藏零值的图例

2 个答案: