Highcharts - Change legend index order

后端 未结 3 422
我在风中等你
我在风中等你 2020-12-31 04:42

When creating a chart with stacked columns using highcharts my series are added by default from top to bottom - the first added series is placed on top. I\'d like to alter t

3条回答
  •  萌比男神i
    2020-12-31 05:34

    Yes that's most definitely possible.

    What you are looking for is the parameter called legendIndex.

    This will allow you to specifiy the order of the items in the legend; hence being able to switch the stacked columns and not switch the legend items.

    For example, you could do the following:

    series: [
            {
                name: 'base',
                data: [10, 20, 30],
                index:1,
                legendIndex:0
            },
            {
                name: 'sec',
                data: [30, 20, 10],
                index:0,
                legendIndex:1
            }
        ]
    

    DEMO


    Update: sorting shared tooltip

    In reaction to Hanoncs comment, it is possible to sort the order in a shared tooltip as in the legend by using a little hack. This hack goes as follows:

    1. Use the property

      yAxis: {
          reversedStacks: false 
      },
      
    2. Reverse the index property of the added series. In the example above, series 'base' then has index:0 and 'sec' is given index:1. The items in the shared tooltip will be sorted reversely.

    DEMO 2


提交回复
热议问题