Some parallel events jump to next day in multi-day view
See original GitHub issueThere seems to be one or more formatting bugs which sets the left: css property incorrectly on parallel events. This results in some parallel events showing up on the wrong day lane in the multi-day calendar.
Looking in the source code, this issue seems related to how the events prop is parsed and in particular how these variables that are used for the css positioning are determined: thisEvent.numberOfOverlaps, thisEvent.overlapIteration, and thisEvent.overlapSegment.
I’ve gotten as far as having three and four side-by-side events showing properly by hacking the calculateDayEventStyle method like this:
if (thisEvent.numberOfOverlaps == 2 && thisEvent.overlapIteration != 1 && thisEvent.overlapSegment == 1) {
style['left'] = (thisShift - 66.66) + '%'
} else if (thisEvent.numberOfOverlaps == 2 && thisEvent.overlapIteration == 1 && thisEvent.overlapSegment == 1) {
style['left'] = (thisShift + 33.33) + '%'
} else if (thisEvent.numberOfOverlaps == 3) {
style['left'] = (thisShift - 25) + '%'
} else {
style['left'] = thisShift + '%'
}
I was hoping to see a pattern and derive a generalised fix, but so far I haven’t found it. Any suggestions or explanation of these variables would be very helpful in debugging further. Thanks
Issue Analytics
- State:
- Created 5 years ago
- Comments:17
Version v0.3.4 has a slightly different overlap algorithm that, with any luck, should address @msinkgraven test case and an additional test case I caught causing problems. Mostly the same with a couple more checks.
Okay, v0.3.3 has been pushed which uses a very different overlap algorithm. I’m hoping it fixes everything above, but I’d love some feedback to see if it works for everyone!