search

zunnzunn / vue-ganttastic

Simple, interactive and highly customizable Gantt chart component for Vue 3
https://zunnzunn.github.io/vue-ganttastic/
565 stars 141 forks source link

Render row labels in a dedicated column #121

Closed LuxiusB44 closed 1 month ago

LuxiusB44 commented 1 month ago

I have a problem with your fantastic Ganttastic library. Specifically, I am having issues with the rows. I want them to look like this (see the first screenshot): image

But instead, they look like this: image

I have checked three different projects that have the layout I want, but I cannot see where it has been implemented. If you could help me, it would be greatly appreciated.

Your biggest fan !

zunnzunn commented 1 month ago

Hey, @LuxiusB44 ! First of all, thank you for the much appreciated positive feedback!

You can achieve the desired behavior using the props label-column-title and label-column-width of the GGanttChart component. For more infos, check out the docs.

When I have time, I will enrich the "Examples" page of the docs with an example using these two props.

LuxiusB44 commented 1 month ago

Yo @zunnzunn, thanks for your response. However, I'm still having an issue. When I apply your suggestions to my GGantChart component, a new column appears, but the row labels disappear. I have a component called IssueRow that contains g-gantt-row, the problems may be this ?

After lable-column-title Capture d’écran du 2024-08-07 12-31-16 Before Capture d’écran du 2024-08-07 12-30-48 How i put label into rows : Capture d’écran du 2024-08-07 12-33-40 Capture d’écran du 2024-08-07 12-36-26