Gantt Auto Scheduling implementation in React JS


I’m new to using this component in react, i found in blog example and it working properly.
But i’m still not found working example for Auto Scheduling feature in react .

Please help.

Many Thanks’

Hello Ferry,
First, you need to install the trial version. To do that, apply the following command:

npm install 'path to gantt folder with package.json file'

for example:

npm install /opt/gantt_trial

If you don’t have package.json file near the codebase folder, you can download the following one:

Then you need to connect the extension. Open Gantt.js file and add the path to the extension after import 'dhtmlx-gantt';. For example:

import 'dhtmlx-gantt';
import 'dhtmlx-gantt/codebase/dhtmlxgantt.css';
import 'dhtmlx-gantt/codebase/ext/dhtmlxgantt_auto_scheduling.js'

Here is a demo with the implementation:

there is no this js file in your demo

Hello @dangxiaowei ,

The demo from the post above contains the GPL version of Gantt, when then “auto scheduling” is a PRO feature.

In order to make auto scheduling work you should:

  1. Download one of the PRO versions of Gantt(for example trial)
  2. Install this version to the demo with npm, for example:
npm install /opt/*gantt_trial*

// gantt_trial is the name of the downloaded folder

  1. Remove the following line from the Gantt.js file :

Because in the current Gantt version(after the 7.0), extensions are including through the “plugins” method:

The changed code in the Gantt.js file will look like follows:

/*global gantt*/
import React, { Component } from 'react';
import 'dhtmlx-gantt';
import 'dhtmlx-gantt/codebase/dhtmlxgantt.css';
// import 'dhtmlx_gantt/codebase/ext/dhtmlxgantt_auto_scheduling.js'

export default class Gantt extends Component {
  componentDidMount() {
      auto_scheduling: true

After these steps, the problem should be solved.

1 Like