Our state of the art Gantt chart


Post by rajesh@step.nz »

Hi

we have percent done for particular task, but gantt chart is not rendering that colour,

here is the data, for that task looking like.

gantt_char-colourIssueData.json
(7.92 KiB) Downloaded 23 times

Thanks
Rajesh

Attachments
image (3).png
image (3).png (76.63 KiB) Viewed 166 times

Post by rajesh@step.nz »

we are expecting to showing up something like below, but it is not showing up

image (4).png
image (4).png (27.53 KiB) Viewed 164 times

Post by marcio »

Hi Rajesh,

Could you share how you set up your Gantt component? It doesn't look like a data-related problem, so we need a sample project or configuration to assist you better with this.

Best regards,
Márcio


Post by rajesh@step.nz »

Hi Marcio,

Thanks for responding back, here is the config of gantt chart,

this.ganttChart = new Gantt({
    appendTo: element,
    // to enable infinite scrolling of dates in gantt chart calendar
    infiniteScroll: true,

startDate: new Date(),
tickSize: 35, // TODO check this

project: {
  autoLoad: true,
  autoSync: true,
  autoCalculatePercentDoneForParentTasks: true,
  transport: {
    load: {
      url: `${ENV.urls.api}/gantt-chart/get-data`,
    },
    sync: {
      url: `${ENV.urls.api}/gantt-chart/sync-data`,
    },
  },
},

columns: [
  {
    type: 'name',
    field: 'name',
    text: 'Name',
    // disable double click edit on columns
    editor: false,
    width: 240,
  },
],

// Custom task content, display task name on child tasks
taskRenderer({ taskRecord }) {
  if (taskRecord.isLeaf && !taskRecord.isMilestone) {
    return StringHelper.encodeHtml(taskRecord.name);
  }
},

features: {
  projectLines: false,
  // disable reordering of columns in grid by dragging
  rowReorder: false,
  // disable right click menu on tasks
  taskMenu: {
    disabled: true,
  },
  // disable sorting on columns in grid
  sort: {
    disabled: true,
  },
  // disable task resizing by manually dragging
  taskResize: {
    disabled: true,
  },
  //disable task editor popup
  taskEdit: {
    items: {
      generalTab: {
        items: {
          effort: {
            label: 'Labour Hours',
            readOnly: true,
          },
          duration: false,
          name: {
            readOnly: true,
          },
        },
      },
      notesTab: false,
      predecessorsTab: true,
      successorsTab: true,
      resourcesTab: false,
      advancedTab: false,
    },
    editorConfig: {
      bbar: {
        // Remove delete button on task editor popup
        items: {
          deleteButton: false,
        },
      },
    },
  },
},
  });

Post by tasnim »

Hello,
I'm not able to reproduce it with your config. Could you please post your app here or post a runnable test case so we can debug it?

Good Luck :),
Tasnim


Post Reply