Search code examples
highchartsseriesgrouphighcharts-gantt

Grouping rows to collapse/xxpand Highcharts Gantt resources


I need to make a mix between the 2 Gantt charts presented on the Highcharts site : the Gantt Project Management and the Gantt Resource Management. My need is to be able to group the different resources on the Gantt Resource Management to be able to collapse/expand the nodes as in the Gantt Project Management.

I tried to do this in a jsfiddle here : https://jsfiddle.net/vegaelce/qz2mLeo1/ I have the group to collapse/expand but one line per resource assignement (I expect only one line for the Jaguar and one line for the Peugeot). When I try to add a Y axis category, I have one line by resource but I loose the group to collapse/expand... (demo here : https://jsfiddle.net/vegaelce/ekf3gzja/)

    yAxis: {
            type: "category",
      }

How to organize my series to get this feature ?

Solution

  • Some hack because this property is preparing for axis type category, but when you add yAxis.uniqueNames you can collapse the task and show these with the same name and different id as your requirement.

      yAxis: {
        uniqueNames: true,
      },
    

    Live demo: https://jsfiddle.net/BlackLabel/esq45bz6/