jgorene
commented
5 years ago Hello...eventually a jsbin or other similar tool maybe could help the help ;) Thank you very much...
Closed kmmm16 closed 5 years ago
jgorene
commented
5 years ago Hello...eventually a jsbin or other similar tool maybe could help the help ;) Thank you very much...
kmmm16
commented
5 years ago Ok, so i find the problem. And it is very poor design of this component. Why?
Month elements (major class) are placed side by side with days, and also they are classified as days:
sometimes also, those elements are not even in correct order, after 29 June we got 1st June...
major elements are messing everything, becaouse they got the same parrent in HTML DOM, so it is not easy to style days, when a month UI element is also a day, example bug:
this is css bug, which we can see when we use example weekend style from official doc
Unfortunately with this problems it is impossible to use css to fix thix issue (i made it with "+" and "~" selectors with css and gradient colors but major elements are still messing up everything).
I tried to fix this issue with jquery css function, attached to onChange event, but this is bad workaround.
This needs to be done on UI design level in src of library. Major and minor elements should be separated (those elements shouldn't have the same parent).
I found some "TODOs" on src. Are you working with this issue or it should be done on some fork of this code?
asiby
commented
5 years ago It may just need some extra css classes to allow targeting things more accurately.
asiby
commented
5 years ago I do not thing that this is a bug.
In fact, I am seeing that the zoom may be working just fine. If you look closely, the periods are showing every other day at the zoom level you have (1, 3, 5, 7, 9, 11, 13, 15, ..., 27, 29).
Because of this, the days that are highlighted as week-end are correct. All you need to do is ignore the days that you are not seeing. Once they appear at another zoom level, they will have the correct background.
From what I see in the first screen capture in your original post, the 14 of January was never highlighted as a week-end. And in the second screen capture, it was simply not shown due to the zoom level. And since it is not visible, you cannot possibly know if it is going to have a week-end background or a week-day background.
Not a bug.
strattonlead
commented
5 years ago @kmmm16
A possible workaround would be to add background areas for your weekends. That's how we solved this. No css needed. Just add those areas for your desired days (weekends).
https://visjs.org/examples/timeline/items/backgroundAreas.html
kmmm16
commented
5 years ago This workaround actually helps me! Thank you 😄 .
Hi, I found a bug, which is confusing me as a user of vis.js library.
Short desc: When we zoom out timeline, weekend background colors are working wrong (wrong columns are colored).
Full description: As you can see, when we got zoomed in timeline, we can easily spot weekends:
Otherwise, when we zoom out the same period of time, we can see bug which i mention:
So, first weekend (5,6 January) looks good, background starts from 5 and includes also 6 day. Unfortunately, next weekend (12, 13 January) looks like it starts from 13 and also include 14 day of January. This situation is repeating for others weekend on timeline).
Please, help me to resolve this issue.