Scheduler - Resource Timeline View

Render horizontal timelines with flat resources, hierarchy, aggregates, resource UI outlets, and RTL support.

#Usage

import { Scheduler } from '@primeui/vue-scheduler';
<Scheduler.Root :resources="resources" view="resourceTimelineWeek" :resource-area-width="240">
    <Scheduler.Header />
    <Scheduler.Content>
        <Scheduler.ResourceTimeline>
            <Scheduler.ResourceAreaHeader />
            <Scheduler.ResourceHeader />
            <Scheduler.ResourceRow />
            <Scheduler.ResourceColumnHeader />
            <Scheduler.ResourceAggregateBadge />
            <Scheduler.TimelineEvent />
        </Scheduler.ResourceTimeline>
    </Scheduler.Content>
</Scheduler.Root>

Resource timeline pairs a resource rail with horizontal time. Bind resources on the root, then provide row, header, aggregate, column-header, and timeline-event parts so each lane carries both resource and time context.

#Resource Timeline

A hierarchical resource timeline combines PrimeOne resource rows with timeline event cards.

Loading Demo...

#Hierarchy

Hierarchical resource timelines include parent groups, child rows, and expansion state.

Loading Demo...

#Aggregate Summaries

Aggregated resource information helps dense rows communicate hidden work.

Loading Demo...

#Horizontal Scroll

Horizontal scrolling keeps column widths, sticky areas, and event positioning visible in Resource Timeline view.

Loading Demo...

#RTL

Resource Timeline supports right-to-left direction with the same event data and interaction model.

Loading Demo...

#Customization

Customize resource timeline rows with domain metadata. Resource ids drive lane geometry, hierarchy expansion, scroll alignment, and event placement.

Loading Demo...

#API

Resource timeline view values include resourceTimelineDay, resourceTimelineWeek, and resourceTimelineMonth. Common props are resources, resourceAreaWidth, resourcesExpandable, resourcesInitiallyExpanded, showAggregatedEvents, rowAutoHeight, and timeline scale props.