React Hooks Gantt Chart


#1

I want to use the React Gantt Chart in React hooks my API data is sending like this

{     
assignedById: null
    assignedByLogin: null
    assignedDate: "2020-03-20T04:22:05Z"
    billingCompany: "Wyoming interface Cotton"
    carrier: "hybrid"
    completedDate: "2020-03-20T03:52:13Z"
    customerDueDate: "2020-03-19T13:58:03Z"
    departmentId: null
    departmentName: null
    description: "Data North Dakota"
    draftDueDate: "2020-03-20T02:32:20Z"
    duration: "PT0.000094146S"
    engineerOfRecordId: null
    engineerOfRecordLogin: null
    erpProjectNo: "Handcrafted Plastic Shirt quantifying"
    estimatedCompletionDate: "2020-03-19T19:45:05Z"
    grade: "D"
    id: 1
}

in the document it’s giving me like
{
id: 1, text: ‘Task #1’, start_date: ‘22-03-2020’, duration: 3, progress: 0.6
},


#2

Hello Anil,
In the React data you don’t have enough required task properties:
https://docs.dhtmlx.com/gantt/desktop__loading.html#dataproperties

Each regular task should have at least 2 date parameters: start_date, end_date, duration. When a regular task doesn’t have those parameters, it should be unscheduled:
https://docs.dhtmlx.com/gantt/desktop__unscheduled_tasks.html
Project tasks ignore the date parameters, so they can be loaded without those parameters:
http://snippet.dhtmlx.com/dd3973ee5

However, it is possible to load tasks without dates. In that case, the dateless tasks will obtain the date parameters from their children or from other tasks.
But those tasks cannot be the first one that you load:
http://snippet.dhtmlx.com/05ced85c4
http://snippet.dhtmlx.com/bc8fdfc9f
If you want to have something like projects, you can assign any date in the onTaskLoading event handler. After adding children, you will be able to see the task, and after you drag or resize children, the parent task will be resized:
http://snippet.dhtmlx.com/a0e68e798

If you add the start_date in your React data, the task should be loaded correctly:
http://snippet.dhtmlx.com/5/368595634

There is a guide that explains how to create a React application with Gantt:


But there is no way to render React elements inside Gantt. And we don’t have guides for React Hooks.