在Highcharts中分组传奇

我有两个堆叠的条形图，但所有图例（两条）都显示在一起。我想根据栏中堆积的项目对图例进行分组。有人能帮助我吗？在Highcharts中分组传奇

$(function() { 
     $('#container').highcharts({ 

      chart: { 
       type: 'bar' 
      }, 

      title: { 
       text: 'Total fruit consumtion, grouped by gender' 
      }, 

      xAxis: { 
       categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas'] 
      }, 

      yAxis: { 
       allowDecimals: false, 
       min: 0, 
       title: { 
        text: 'Number of fruits' 
       } 
      }, 

      tooltip: { 
       formatter: function() { 
        return '<b>'+ this.x +'</b><br/>'+ 
         this.series.name +': '+ this.y +'<br/>'+ 
         'Total: '+ this.point.stackTotal; 
       } 
      }, 

      plotOptions: { 
       bar: { 
        stacking: 'normal' 
       } 
      }, 

      series: [{ 
       name: 'John', 
       data: [5, 3, 4, 7, 2], 
       stack: 'male' 
      }, { 
       name: 'Joe', 
       data: [3, 4, 4, 2, 5], 
       stack: 'male' 
      }, { 
       name: 'Jane', 
       data: [2, 5, 6, 2, 1], 
       stack: 'female' 
      }, { 
       name: 'Janet', 
       data: [3, 0, 4, 4, 3], 
       stack: 'female' 
      }] 
     }); 
    });

我有类似的酒吧类型。我想将珍妮特和珍妮分为一组，乔和约翰为另一组。

来源

2013-04-10 Agi la

当你说你有2个图表，你的意思是你有2分多系列？ 2系列多点？ 2个完全不同的图表？ – 2013-04-10 13:00:24

你能告诉我们你到目前为止使用的代码吗？ – 2013-04-10 13:01:09

请参阅http://jsfiddle.net/cindrella_agi/6gw5P/我有类似的栏。我想将珍妮特和珍妮分为一组，乔和约翰为另一组。 – 2013-04-10 13:07:36

根据您链接到参考例子，你可以用新的系列做这个 'linkedTo' 在版本属性3.

http://api.highcharts.com/highcharts#plotOptions.series.linkedTo

更新例如： http://jsfiddle.net/jlbriggs/6gw5P/2/

linkedTo:':previous'

来源

2013-04-10 14:30:35 jlbriggs

这很酷。 upvoted。尽管如此，仍然让颜色混淆。 – 2013-04-10 14:40:07

是的，我不认为有很好的方法来处理颜色。我们可以做得更好，虽然... http://jsfiddle.net/jlbriggs/6gw5P/4/ – jlbriggs 2013-04-10 15:45:30

当然，只要你关闭你的parens :) http://jsfiddle.net/6gw5P/6/ – 2013-04-10 16:25:37

您无法按照堆栈对传说进行分组，因为那样您将失去识别不同组件的能力（IE各个系列不会有明显的颜色，或者图例颜色不匹配它们）。传说映射到人们，因为这些都是不同的数据源，并且因为您以这种方式添加它们，所以它们就像那样显示它们。

如果您不关心具有不同颜色的不同组件，那么您根本不需要堆叠条形图。你可以有一个正常的条形图，包含2个系列，男性和女性。

series: [{ 
       name: 'Male', 
       data: [10, 7, 8, 9, 7] 
      }, 
       name: 'Female', 
       data: [5, 5, 10, 6, 4] 
      } 
     }

来源

2013-04-10 13:14:57

我知道这是一个老问题，但在你的系列中设置showInLegend会起作用，而且似乎是最简单的方法。

showInLegend: false

如：

series: [{ 
name: 'John', 
data: [5, 3, 4, 7, 2], 
stack: 'male', 
showInLegend: false 
}

来源

2017-01-11 16:14:55

这是我一直在寻找的解决方案，其他一切都太复杂，更重要的是，没有奏效。不过，我还为数据点I _did_包含在图例中包含了一个'showInLegend：true' - 并且它的工作非常完美。谢谢雅各布！ – pshep123 2017-12-25 14:12:06

在Highcharts中分组传奇

回答

相关问题