The treeAnimationEasing property (string) sets the timing curve used for tree expand/collapse animation.

Declaration

DayPilot.Gantt.treeAnimationEasing

Default Value

"standard"

Notes

Supported values are "standard" (default), "linear", "ease", "ease-in", "ease-out", "ease-in-out", and a cubic-bezier() string.

"standard" uses cubic-bezier(0.2, 0, 0.38, 0.9). A custom curve must contain four numbers, each between 0 and 1, for example "cubic-bezier(0.25, 0.1, 0.25, 1)". Other CSS timing functions and values outside this range are not accepted; invalid values throw an exception.

Use treeAnimationDuration to change the duration.

Available since version 2026.4.7077 of DayPilot Pro for JavaScript.

Examples

JavaScript configuration:

const dp = new DayPilot.Gantt("dp", {
  treeAnimationEasing: "ease-in-out"
});
dp.init();

Angular configuration:

config: DayPilot.GanttConfig = {
  treeAnimationEasing: "ease-in-out"
};
<daypilot-gantt [config]="config"></daypilot-gantt>

React:

<DayPilotGantt treeAnimationEasing={"ease-in-out"} />

Vue:

<DayPilotGantt :treeAnimationEasing="'ease-in-out'" />

See Also

Tree configuration

Availability

Availability of this API item in DayPilot editions:

ProductLitePro
DayPilot for JavaScript