Use this way to initialize the gantt graph, and then the project startDate cannot be initialized.
And my gantt's config is not init project params.
The error is as follows
Hi,
It's hard to understand what's wrong. We need to dive into the code and need to run it. Could you please upload a runnable test case here so we can debug it?
Okey.
Below is my demo.
I tried two methods to initialize the project start date, but neither of them worked properly.
import React, { Fragment } from 'react';
import { BryntumDemoHeader, BryntumGantt, BryntumThemeCombo } from '@bryntum/gantt-react';
import './lib/StatusColumn';
import './lib/GanttToolbar';
import './App.scss';
const tasks = [
{
"duration": 1,
"endDate": "2023-02-03",
"id": 1,
"isLeaf": 1,
"manuallyScheduled": true,
"name": "task 1",
"note": "",
"parentId": 0,
"parentIndex": 0,
"percentDone": 0,
"startDate": "2023-02-02",
"children": [
{
"children": [],
"duration": 1,
"endDate": "2023-01-03",
"id": 2,
"isLeaf": 1,
"manuallyScheduled": true,
"name": "task 2",
"note": "",
"parentId": 1,
"parentIndex": 0,
"percentDone": 0,
"startDate": "2023-02-02"
}
]
}
]
const dependencies = [
{
"fromTask": 1,
"toTask": 2,
"type": 2,
"lag": 1
}
]
const resources = [
{ "id" : 1, "name" : "Celia", "city" : "Barcelona", "calendar" : null, "image" : "celia.jpg" },
{ "id" : 2, "name" : "Lee", "city" : "London", "calendar" : null, "image" : "lee.jpg" },
{ "id" : 3, "name" : "Macy", "city" : "New York","calendar" : null, "image" : "macy.jpg" },
{ "id" : 4, "name" : "Madison", "city" : "Barcelona", "calendar" : null,"image" : "madison.jpg" },
{ "id" : 5, "name" : "Rob", "city" : "Rome", "calendar" : "business", "image" : "rob.jpg" },
{ "id" : 6, "name" : "Dave", "city" : "Barcelona", "calendar" : "night", "image" : "dave.jpg" },
{ "id" : 7, "name" : "Dan", "city" : "London", "calendar" : "night", "image" : "dan.jpg" },
{ "id" : 8, "name" : "George", "city" : "New York", "calendar" : null, "image" : "george.jpg" },
{ "id" : 9, "name" : "Gloria", "city" : "Rome", "calendar" : null, "image" : "gloria.jpg" },
{ "id" : 10, "name" : "Henrik", "city" : "London", "calendar" : null, "image" : "henrik.jpg" }
]
const assignments = [
]
const columns = [
{ type: 'wbs' },
{ type: 'name', width: 250 },
{ type: 'startdate' },
{ type: 'duration' },
{ type: 'resourceassignment', width: 120, showAvatars: true },
{ type: 'percentdone', showCircle: true, width: 70 },
{
type : 'predecessor',
width : 112
},
{
type : 'successor',
width : 112
},
{ type: 'schedulingmodecolumn' },
{ type: 'calendar' },
{ type: 'constrainttype' },
{ type: 'constraintdate' },
{ type: 'statuscolumn' },
{
type : 'date',
text : 'Deadline',
field : 'deadline'
},
{ type: 'addnew' }
]
const ganttConfig = {
tbar : { type: 'gantttoolbar' },
dependencyIdField : 'wbsCode',
newTaskDefaults: {
duration: 1,
manuallyScheduled: true
},
// project: {
// "startDate" : "2019-01-20", the first method
// },
resourceImageFolderPath : 'users/',
subGridConfigs: {
locked: {
flex : 3
},
normal: {
flex : 4
}
},
columnLines : false,
rollupsFeature: {
disabled : true
},
baselinesFeature: {
disabled : true
},
progressLineFeature: {
disabled : true,
statusDate : new Date(2019, 0, 25)
},
filterFeature : true,
dependencyEditFeature : true,
timeRangesFeature : {
showCurrentTimeLine : true
},
labelsFeature: {
left: {
field : 'name',
// editor : {
// type : 'textfield'
// }
}
}
};
const App = props => {
return <>
<BryntumGantt
tasks={tasks}
assignments={assignments}
dependencies={dependencies}
resources={resources}
columns={columns}
// project={{startDate: '2020-03-10'}} the second method
{...ganttConfig}
/>;
</>
};
export default App;
So how should this problem be solved?
Hey chenghuang,
You can use the following to set the startDate
<BryntumGantt
tasks={tasks}
assignments={assignments}
dependencies={dependencies}
resources={resources}
columns={columns}
startDate={'2020-03-10'}
{...ganttConfig}
/>;Thank you, but I have also tried your method, the project start time will read the earliest time in the task list, not the startDate I configured.
Hey chenghuang,
I'm sharing an example project with the startDate set as I shared with you and a screenshot of that start date being displayed as I configured it.
Hey marcio,
I downloaded the demo you shared with me and opened it to see that the startDate is '2020-03-10', but your demo shows the earliest time in the task list.
Hey chenghuang,
That's the expected behavior if you change for something like
startDate={'2020-10-01'}You'll change the start of the project to be like the attached screenshot.
What do you want to achieve exactly? Change the view to be earlier than the project start date?
yeah, my project start time is deterministic, but the task's earliest start time is not necessarily equal to the project start time。