Skip to content

Function: timeline() ​

ts
function timeline(options): TimelineFigure;

Build a Gantt chart figure from a table, like plotly.py's px.timeline: one horizontal bar trace per color group, base = the start dates (as given), x = durations in ms, barmode: 'overlay' and a date x axis. Rows whose start or end is not a valid date are skipped. Differences from px: rows read top-down by default (reverseY), colors come from the template's colorway unless colorDiscreteMap / colorDiscreteSequence is given, and hover dates show the time of day only when some start or end has one.

Parameters ​

ParameterType
optionsTimelineFigureOptions

Returns ​

TimelineFigure

Example ​

ts
import { createChart, timeline } from '@mk7s/holochart';

const figure = timeline({
  data: [
    { Task: 'Design', Start: '2026-03-02', Finish: '2026-03-13', Team: 'UX' },
    { Task: 'Build', Start: '2026-03-09', Finish: '2026-04-03', Team: 'Dev' },
  ],
  xStart: 'Start',
  xEnd: 'Finish',
  y: 'Task',
  color: 'Team',
});
createChart(el, figure);

Released under the MIT License.