javascript - Highcharts:在图例上显示系列但在图表上隐藏

Question

在 highcharts 中有没有一种方法可以隐藏图表中的系列，但仍将其显示在图例上？

或者，我们可以添加一个假想的/伪图例项目但实际上并不存在于图表中吗？

对于上下文:客户要求我们根据类别为条形着色(前 10 个条形应为默认颜色深蓝色，接下来的 2 个条形为蓝色，最后 3 个条形为浅蓝色)。现在他们要求我们放置 3 个图例项目:A 组(前 10 个柱)、B 组(接下来的 2 个)、C 组(最后 3 个)。 B 组和 C 组不需要可点击，因为它们是虚构的图例。

Answer 1

您可以设置任意数量的虚拟系列，没有数据，这将在图例中设置一个条目。

为确保虚拟系列不占用绘图区域的任何空间，您可以在 plotOptions 中设置 grouping: false。

代码:

plotOptions: {
  series: {
    grouping: false,
    events: {
      legendItemClick: function() {
        return false;
      }
    }
  }
}

返回 false 的 legendItemClick 事件会阻止图例显示/隐藏系列。如果您想要不同的行为，您可以更详细地使用该函数。

当然，如果您想要图例的完整行为，您可以使用三个实际系列构建图表，而不是使用两个虚拟系列，并且只需以 [x,y] 对形式提供数据。

fiddle :

• http://jsfiddle.net/jlbriggs/3d3fuhbb/167/

输出: