Methods
Core Methods
render ()
Renders the chart and initializes all components.
apexGantt.render();
update (newOptions)
Updates the entire Gantt chart with new configuration and task data.
apexGantt.update({
series: [
{
id: 'task-1',
name: 'Design Phase',
start: '2025-07-01',
end: '2025-07-10',
progress: 40
},
// more tasks...
],
pixelsPerDay: 25.7,
});
Task Methods
updateTask (taskId, taskData)
Updates the specific task with provided task data.
apexGantt.updateTask('task-1', {
name: 'Design Phase',
start: '2025-07-01',
end: '2025-07-10',
progress: 40
});
addTask (input, options?)
Inserts a new task and re-renders the chart. The operation is recorded in the undo history and emits a taskAdded event on success. If a beforeTaskAdd hook is configured and returns false, the insertion is cancelled and the method returns null. Throws when input.id is missing or already exists.
options.parentId inserts the task under the given parent; omit for a root-level task. Returns the inserted Task, or null when the hook cancels.
apexGantt.addTask({
id: 'task-9',
name: 'Review',
startTime: '2026-08-01',
endTime: '2026-08-05',
});
apexGantt.addTask(
{ id: 'subA', name: 'Subtask', startTime: '2026-08-01', endTime: '2026-08-03' },
{ parentId: 'task-9' }
);
deleteTask (taskId, options?)
Removes a task and re-renders. Recorded in the undo history. Dependency edges that reference removed tasks are auto-cleaned in the same transaction, so undo restores tasks and edges atomically.
Cascade modes via options.cascade:
- forbid (default) — throws when the task has children. Safe default that prevents accidental subtree loss.
- children — deletes the task plus every descendant in a single undoable transaction.
- orphan — reparents the immediate children to the deleted task's parent, then removes just the task itself.
If beforeTaskDelete returns false, the removal is cancelled and the method returns false. Returns true when the task was removed.
apexGantt.deleteTask('task-3'); // leaf — uses default 'forbid'
apexGantt.deleteTask('task-1', { cascade: 'children' }); // summary + descendants
apexGantt.deleteTask('task-1', { cascade: 'orphan' }); // keep children, remove summary
moveTask (taskId, options?)
Re-parents a task and re-renders. Recorded in the undo history. Emits a taskMoved event. Pass newParentId: null (or omit) to promote the task to the root level.
Throws when taskId doesn't exist, when newParentId doesn't exist, when moving onto itself, or when the move would create a cycle. Returns true on success, false if beforeTaskMove cancelled.
apexGantt.moveTask('subA', { newParentId: 'task-2' });
apexGantt.moveTask('subA', { newParentId: null }); // promote to root
Dependency Methods
addDependency (fromId, toId, options?)
Creates a dependency edge between two tasks and re-renders the arrow. Recorded in undo history. Emits dependencyAdded. Runs through beforeDependencyChange.
options accepts { type?: 'FS' | 'FF' | 'SS' | 'SF', lag?: number }. Defaults to type: 'FS', lag: 0. Throws when either task doesn't exist or when the edge already exists.
apexGantt.addDependency('t1', 't2'); // FS, lag 0
apexGantt.addDependency('t1', 't2', { type: 'SS', lag: 2 });
removeDependency (fromId, toId)
Removes a dependency edge and re-renders. Recorded in undo history. Emits dependencyRemoved with the captured type and lag. Runs through beforeDependencyChange. Throws when no edge exists between the two tasks.
apexGantt.removeDependency('t1', 't2');
canAddDependency (fromId, toId, options?)
Returns whether a new edge fromId → toId would be accepted right now, without committing it. Shared by the programmatic API and the interactive draw UI so both apply the same rules.
Returns { ok: true } when the edge would be accepted, or { ok: false, reason } where reason is one of 'self', 'task-missing', 'duplicate', 'cycle', 'summary-descendant', or 'hook-veto'.
const verdict = apexGantt.canAddDependency('t1', 't2');
if (verdict.ok) apexGantt.addDependency('t1', 't2');
else console.warn(verdict.reason);
History Methods
undo ()
Rolls back the most recent recorded transaction; data and DOM return to the pre-operation state. Emits historyChange with kind: 'undo'. Returns true if a transaction was undone, false when the undo stack is empty or history.enabled is false.
apexGantt.updateTask('t1', { progress: 90 });
apexGantt.undo();
redo ()
Replays the most recently undone transaction. Emits historyChange with kind: 'redo'. Any new mutating call between undo() and redo() discards the redo stack. Returns true if a transaction was redone.
apexGantt.redo();
canUndo () / canRedo ()
Returns whether an undoable or redoable transaction is currently on top of the stack. Use to gate custom Undo/Redo UI affordances.
myUndoButton.disabled = !apexGantt.canUndo();
myRedoButton.disabled = !apexGantt.canRedo();
clearHistory ()
Drops every recorded transaction and emits historyChange with kind: 'clear'. Useful after loading a fresh dataset where rolling back to a previous tree state would be incoherent.
apexGantt.update({ series: freshTasks });
apexGantt.clearHistory();
getHistorySize ()
Returns the current undo/redo stack sizes as { undo: number, redo: number }.
const { undo, redo } = apexGantt.getHistorySize();
Selection Methods
getSelectedTasks ()
Returns an array of currently selected task objects. Requires enableSelection: true.
const selected = apexGantt.getSelectedTasks();
setSelectedTasks (ids)
Programmatically set the selection to the given task IDs. Requires enableSelection: true.
apexGantt.setSelectedTasks(['task-1', 'task-3']);
clearSelection ()
Clear all selected tasks. Requires enableSelection: true.
apexGantt.clearSelection();
Lifecycle Methods
destroy ()
Destroys the chart instance and frees all associated resources — removes event listeners, disconnects ResizeObservers, clears the tooltip, clears the DOM, and nulls internal references. After calling destroy(), the instance cannot be reused — create a new ApexGantt instead. Call before removing the host element from the DOM or in framework cleanup hooks (ngOnDestroy, React useEffect cleanup, Vue onBeforeUnmount).
apexGantt.destroy();
isDestroyed ()
Returns true if the chart has been destroyed or the host element is empty. Use as a guard before calling other methods when unsure whether destroy() has already been called.
if (!apexGantt.isDestroyed()) {
apexGantt.update({ series: nextTasks });
}
Zoom Methods
zoomIn()
Increases pixelsPerDay to zoom the timeline in. The header tier (year → quarter → month → week → day → halfday → hour → minute) is auto-picked from the new density.
apexGantt.zoomIn();
zoomOut()
Decreases pixelsPerDay to zoom the timeline out. The header tier (minute → hour → halfday → day → week → month → quarter → year) is auto-picked from the new density.
apexGantt.zoomOut();