Skip to main content

baselines

The functionality is available in PRO Edition only

PRO

Description​

Optional. Shows or hides tasks baselines

Usage​

baselines?: boolean;

Parameters​

  • baselines - to show baselines, set the value to true. Baselines are not displayed by default (false). It's also necessary to set the start and end time for baselines via the tasks property.

Example​

import { getData } from "../data";
import { Gantt } from "@svar/react-gantt";

export default function App() {
  const data = getData();

  const tasks = [
    {
      id: 1,
      start: new Date(2024, 3, 3),
      duration: 4,
      text: "React Gantt Widget",
      progress: 60,
      type: "summary",
      open: true,
      base_start: new Date(2024, 3, 3),
      base_end: new Date(2024, 3, 6),
    },
    {
      id: 2,
      start: new Date(2024, 3, 3),
      duration: 3,
      text: "Lib-Gantt",
      progress: 80,
      parent: 1,
      type: "task",
      base_start: new Date(2024, 3, 3),
      base_end: new Date(2024, 3, 6),
    },
  ];

  return (
    <Gantt
      baselines={true}
      cellHeight={45}
      tasks={tasks}
      links={data.links}
      scales={data.scales}
    />
  );
}

Related artciles: