ProVerticalLayout

Assists with event layout in vertical mode, you can implement a custom layout using the layoutFn. Example usage:

new SchedulerPro({
    mode : 'vertical',
    eventLayout : {
        layoutFn(items, resource, scheduler) {
            items.forEach(item => {
                item.top = Math.round(Math.random() * 100);
                item.height = Math.round(Math.random() * 100);
            });

            return 150; // The resource column width
        }
    }
})

Configs

layoutFn: function

Supply a function to manually layout events. It accepts event layout data and should set top and height for every provided data item (left and width are calculated according to the event start date and duration). The function should return the total row height in pixels.

If you need a reference to the SchedulerPro instance, you can get that from the function scope (arrow function doesn't work here):

new SchedulerPro({
    mode : 'vertical',
    eventLayout : {
        layoutFn(items, resource, scheduler) {
            items.forEach(item => {
                item.left = Math.round(Math.random() * 100);
                item.width = Math.round(Math.random() * 100);
            });

            return 150;
        }
    }
})

Parameter	Type	Description
`events`	EventRenderData[]	Unordered array of event render data, sorting may be required
`resource`	ResourceModel	The resource for which the events are being laid out
`scheduler`	SchedulerPro	The SchedulerPro instance

Returns: Number -

The resource column width

type: mixed | pack | none

Type of vertical layout. Supported values are mixed, pack and none.