timeline items with overlapping texts

[schotman]

My timeline view on mobile shows overlapping texts when scrolling horizontally. This issues occurs in also in the http://visjs.org/examples/timeline/items/pointItems.html example under specific situation.
Steps to reproduce:

1. resize the chart such that the view contains items on the same line (screenshot 1)
2. scroll to the left such that the group resizes in height
3. scroll back to the right and see that items are overlapping (screenshot 2)

When pinching the screen redraws and everything is fine again, any idea how to invoke a redraw after a scroll?

[josdejong]

Thanks for the detailed description, I can reproduce this bug.

There are event rangechange and rangechanged fired while moving and zooming, you could use that to force an extra redraw.

[bradh]

Still appears to occur with current version (develop branch as of 3456acf, although that particular commit is nothing to do with this bug, just the testing point).

I couldn't reproduce with the left-right sequence, but it does occasionally occur if you go right (to get the resizing) then left.

[roboslone]

This is happening to me while using react-visjs-timeline and custom CSS with .vis-item .vis-item-overflow {overflow: visible;}:

Is there a way to make timeline consider whole content width?

[bradh]

Perhaps this is the same issue as #1982 ?

[yotamberk]

@roboslone The addition of overflow: visible is not healthy for the timeline. it is not meant to show the contents. If you want to show contents without overlapping, use point items. The stacking function of items does not consider contents but their containers. What you are requesting is a new feature.

@bradh the original issue is indeed a duplicate

[mojoaxel]

Is there a way to make timeline consider whole content width?

@roboslone This makes no sense! Timeline items have a start and a end. How would you recommend to handle dynamic sizing?

the original issue is indeed a duplicate

@yotamberk I'm not sure if this a duplicate of #1982 If so, we should close one of them.

[roboslone]

@mojoaxel, in my case almost all items are visually shorter, then their content. How does this work for point items? They have end, that isn't visible, but is considered by stacking mechanism? If so, would it be possible to have similar fake end for ranged items and only consider it for stacking, but not for drawing?

[mojoaxel]

@roboslone In your case I would recommend shortening the text e.g. by removing the hash and e.g. use different colors or icons for "deactivation", "remove" and so on...
Maybe you can first figure out how you want the timeline and your content to look and than we can see if it is possible to realize! Maybe could can draw a mockup or something!?

[roboslone]

@mojoaxel, unfortunately, that's not possible, item content is provided by users, I have no control over it and I shouldn't modify info supplied by users.
As to mockup, I think it's pretty straight forward, I just want timeline to consider text length, like it does with point events.