Programs with different start/ends seem to be grid aligned

[MiddleMan5]

Planby 1.1.7
Following demo here with custom data: https://codesandbox.io/s/planby-epg-demo-ts-lp66v5

Items appear to be aligned to some kind of grid with no obvious way to change grid resolution.

[MiddleMan5]

Super lazy note to author, and more for reference, but I solved my problem by intercepting the calculated program positions and re-writing my own width and horizontal placement function.

I found that the one of original getPositionX helper functions rounds the time values unnecessarily and also contains some unnecessary branches.

Effectively I replaced all of the getPositionX code with the code below:

const MS_PER_HOUR = 1000 * 60 * 60;

export const getPositionX = (
    since: Date,
    till: Date,
    startDate: Date,
    endDate: Date,
    hourWidth: number
) => {
    // Constrain the start and end of the rendered blocks to the start and end times displayed
    const renderStartTimeMs = Math.max(since.getTime(), startDate.getTime());
    const renderEndTimeMs = Math.min(till.getTime(), endDate.getTime());
    const diffMs = Math.max(0, renderEndTimeMs - renderStartTimeMs);
    return (diffMs * hourWidth) / MS_PER_HOUR;
};

Is the rounding expected behavior currently?

[karolkozer]

Hi @MiddleMan5

Thank you for reporting this behavior with the element in the layout.
I will check this functions and your suggestion regarding it.