Skip to main content

rollups

The functionality is available in PRO Edition only

PRO

Description​

Optional. Shows or hides task rollups on summary tasks

Usage​

rollups?: boolean | { type: "all" | "closest" };

Parameters​

  • rollups - enables task rollup visualization on summary tasks. Accepts the following values:
    • false - rollups are disabled (default)
    • true or "closest" - tasks roll up to the closest parent summary task only
    • "all" - tasks roll up to all parent summary tasks in the hierarchy

Tasks can only roll up to summary tasks, not to any nearest parent that has subtasks.

Example​

<script>
  import { getData } from "../data";
  import { Gantt } from "@svar-ui/svelte-gantt";

  const data = getData();

  const tasks = [
    {
      id: 1,
      start: new Date(2024, 3, 1),
      duration: 10,
      text: "Website Redesign",
      progress: 40,
      type: "summary",
      open: true,
    },
    {
      id: 2,
      start: new Date(2024, 3, 1),
      duration: 4,
      text: "Design mockups",
      progress: 80,
      parent: 1,
      type: "task",
      rollup: true,
    },
    {
      id: 3,
      start: new Date(2024, 3, 5),
      duration: 6,
      text: "Frontend development",
      progress: 20,
      parent: 1,
      type: "task",
      rollup: true,
    },
  ];
</script>

<Gantt
    rollups={true}
    cellHeight={45}
    {tasks}
    links={data.links}
    scales={data.scales} />

Related sample: Rollups

Related articles: