This article provides a step-by-step guide to run the Syncfusion Gantt code component in local (TestHarness).
Before getting started with the Syncfusion Gantt code component, ensure the following prerequisites are satisfied:
- node.js (>= v18.20.4) (LTS version is recommended)
- System requirements for Syncfusion React components
To run the Syncfusion Gantt code component, follow these steps:
-
Ensure that all the prerequisites are met.
-
Open a command prompt (cmd) and navigate to the Gantt code component, which is located in the components/gantt/ folder.
-
Utilize the following command to install the dependent packages:
npm install
- Execute the sample with the following command to visualize the Gantt code component:
npm start watch
- Now, within the
Data Inputs
section of the property pane, designate the data source for the Gantt code component using the ganttData.csv.
Note
After loading the data source, proceed to select the required column types of DataSource section in the property pane. For example, assign the Whole.None
column type for the TaskID
column of DataSource property.
-
After loading the CSV file, click the
Apply
button to load the data source in the Gantt code component. -
Once the data is loaded, include the necessary ganttConfig data for the Gantt code component by accessing the
ganttConfig
property and paste the Gantt config data.
- Customize the Gantt code component properties in the right property pane.
Note
Additionally, explore the API documentation for comprehensive details on the properties, methods, and events of the Gantt code component.