Our state of the art Gantt chart


Post by amitcodeadda »

Hi Team,
I want to show workedhour in ResourceUtilization in reactjs.
Currently I can use this

teamhour.png
teamhour.png (45.66 KiB) Viewed 156 times

but I need this

limited_time.png
limited_time.png (59.04 KiB) Viewed 156 times

resource utilization view. I can pass the hoursWorked value in the JSON file

"tasks"        : {
        "rows" : [
            {
                "id"          : 1,
                "name"        : "Setup web server",
                "percentDone" : 50,
                "startDate"   : "2021-03-22",
                "rollup"      : true,
                "expanded"    : true,
                "children"    : [
                    {
                        "id"          : 10,
                        "name"        : "Data center server setup",
                        "percentDone" : 20,
                        "startDate"   : "2021-03-22",
                        "rollup"      : true,
                        "duration"    : 5,
                        "hoursWorked" : [
                            2,
                            8,
                            9,
                            10,
                            6
                        ]
                    },
                    {
                        "id"          : 11,
                        "name"        : "Install Apache",
                        "percentDone" : 20,
                        "startDate"   : "2021-03-22",
                        "rollup"      : true,
                        "duration"    : 5,
                        "hoursWorked" : [
                            4,
                            6,
                            2,
                            4,
                            5
                        ]
                    },
                    {
                        "id"             : 12,
                        "name"           : "Configure firewall",
                        "percentDone"    : 80,
                        "startDate"      : "2021-03-29",
                        "rollup"         : true,
                        "duration"       : 5,
                        "showInTimeline" : true,
                        "hoursWorked"    : [
                            3,
                            4,
                            2,
                            8,
                            3
                        ]
                    },
                    {
                        "id"          : 13,
                        "name"        : "Setup load balancer",
                        "percentDone" : 30,
                        "startDate"   : "2021-04-05",
                        "rollup"      : true,
                        "duration"    : 5,
                        "hoursWorked" : [
                            3,
                            4,
                            2,
                            8,
                            3
                        ]
                    }
                ]
            },
            {
                "id"          : 2,
                "name"        : "Choose JavaScript Framework",
                "percentDone" : 50,
                "startDate"   : "2021-04-12",
                "rollup"      : true,
                "expanded"    : true,
                "children"    : [
                    {
                        "id"          : 20,
                        "name"        : "Evaluate React",
                        "percentDone" : 40,
                        "startDate"   : "2021-04-12",
                        "rollup"      : true,
                        "duration"    : 4,
                        "hoursWorked" : [
                            2,
                            8,
                            9,
                            6
                        ]
                    },
                    {
                        "id"          : 21,
                        "name"        : "Evaluate Next.js",
                        "percentDone" : 20,
                        "startDate"   : "2021-04-16",
                        "rollup"      : true,
                        "duration"    : 4,
                        "hoursWorked" : [
                            4,
                            6,
                            4,
                            5
                        ]
                    },
                    {
                        "id"             : 22,
                        "name"           : "Evaluate Vue",
                        "percentDone"    : 80,
                        "startDate"      : "2021-04-22",
                        "rollup"         : true,
                        "duration"       : 4,
                        "showInTimeline" : true,
                        "hoursWorked"    : [
                            3,
                            2,
                            8,
                            3
                        ]
                    },
                    {
                        "id"             : 23,
                        "name"           : "Evaluate Svelte",
                        "percentDone"    : 80,
                        "startDate"      : "2021-04-28",
                        "rollup"         : true,
                        "duration"       : 4,
                        "showInTimeline" : true,
                        "hoursWorked"    : [
                            3,
                            2,
                            8,
                            3
                        ]
                    }
                ]
            },
            {
                "id"          : 3,
                "name"        : "Choose Server Stack",
                "percentDone" : 50,
                "startDate"   : "2021-03-22",
                "rollup"      : true,
                "expanded"    : true,
                "children"    : [
                    {
                        "id"          : 30,
                        "name"        : "Evaluate C#",
                        "percentDone" : 70,
                        "startDate"   : "2021-03-22",
                        "rollup"      : true,
                        "duration"    : 5,
                        "hoursWorked" : [
                            2,
                            3,
                            4,
                            6,
                            1
                        ]
                    },
                    {
                        "id"          : 31,
                        "name"        : "Evaluate Java",
                        "percentDone" : 20,
                        "startDate"   : "2021-03-22",
                        "rollup"      : true,
                        "duration"    : 5,
                        "hoursWorked" : [
                            4,
                            6,
                            6,
                            4,
                            5
                        ]
                    },
                    {
                        "id"             : 32,
                        "name"           : "Evaluate Python",
                        "percentDone"    : 80,
                        "startDate"      : "2021-03-29",
                        "rollup"         : true,
                        "duration"       : 5,
                        "showInTimeline" : true,
                        "hoursWorked"    : [
                            3,
                            2,
                            8,
                            5,
                            3
                        ]
                    },
                    {
                        "id"             : 33,
                        "name"           : "Evaluate Node",
                        "percentDone"    : 80,
                        "startDate"      : "2021-03-29",
                        "rollup"         : true,
                        "duration"       : 5,
                        "showInTimeline" : true,
                        "hoursWorked"    : [
                            3,
                            2,
                            10,
                            8,
                            3
                        ]
                    }
                ]
            }
        ]
    },

but hoursWorked data is not rendering in ResourceUtilization


Post by marcio »

Hey,

Could you please share the full configuration object that you're using?? It's easier to help you with that information.

Best regards,
Márcio


Post Reply