Task labels remain at a fixed position within their bars, so when zoomed in and scrolling horizontally, they can be cropped or off-screen, even though there is plenty of room to show the label on-screen.
Is there an easy way to have the labels automatically slide within the task bars so that they remain on-screen? This is done in a timeline library we’ve used: Timeline | Basic demo - if you drag the timeline to the left, you’ll see the effect on “item 4”.
Hello,
DHTMLX Gantt doesn’t have that feature. If you need that functionality, you need to implement a custom solution by using the Gantt API and Javascript.
The easiest way to do that is to check the task and scroll position and change the left margin of the DOM element.
Here is an example of the implementation:
Excellent! Thanks! I noticed the labels would overflow to the right of the bar, so I made two changes:
.gantt_task_content { text-align:left; }
taskText.style.maxWidth = (sizes.width - marginLeft) + "px";