Skip to main content

splitTasks

PRO

The functionality is available in PRO Edition only

Description​

Enables displaying and editing split tasks

The property controls whether the Gantt chart should display and allow editing of split tasks — tasks divided into multiple timeline segments. When splitTasks is enabled, each task can contain the segments array defined inside the tasks object. Summary tasks and milestones cannot be split.

Usage​

splitTasks?: boolean;

Parameters​

  • true - enables the split-task functionality:
    • Gantt displays task segments on the timeline
    • Editor supports segments editing
    • and a button for split actions appears in Toolbar and ContextMenu
  • false - (default) disables the split-task functionality

Example​

import { useState } from "react";
import { getSplitTasksData } from "../data";
import { Gantt, ContextMenu, Editor } from "@svar/react-gantt";

function App() {
  const [api, setApi] = useState();
  const data = getSplitTasksData();

  return (
    <>
      <ContextMenu api={api}>
        <Gantt
          apiRef={setApi}
          tasks={data.tasks}
          splitTasks={true}
        />
      </ContextMenu>

      <Editor api={api} />
    </>
  );
}

export default App;

Related articles: