Premium support for our pure JavaScript UI components


Post by nishant.garg »

Hi team,

I’ve encountered an issue where the indicators appear to render incorrectly when using fill ticks. I’ve attached a video demonstrating the behavior, along with the code snippet used.

import * as Module from 'https://bryntum.com/products/gantt/build/gantt.module.js?491410';
Object.assign(window, Module);
// The code above imports module bundle and places all Bryntum classes on window to simplify coding at CodePen

// Project contains all the data and is responsible for correct scheduling
const project = new ProjectModel({
  startDate : '2020-02-20',
  calendar     : 'business',
  calendars : {
    rows : [
      {
        id   : 'business',
        name : 'Business calendar',

    intervals : [

      // Weekdays working hours
      {
        recurrentStartDate : 'every weekday at 09:00',
        recurrentEndDate   : 'every weekday at 17:00',
        isWorking          : true
      }
    ]
  }
]
  },

  tasks : [
    {
      id       : 1,
      name     : 'Write docs',
      expanded : true,
      children : [
        {
          id             : 2,
          name           : 'Proof-read docs',
          startDate      : '2020-02-24T09:00:00',
          duration       : 7,
          durationUnit   : 'hours',
          calendar       : 'business'
        },
        {
          id           : 3,
          name         : 'Release docs',
          startDate    : '2020-02-24',
          duration     : 1,
          deadlineDate : '2020-03-05',
          calendar     : 'business'
        }
      ]
    }
  ],

  dependencies : [
    { fromTask : 2, toTask : 3 }
  ]
});

const gantt = new Gantt({
    features : {
        indicators   : true,
        projectLines : false
    },
    appendTo  : document.body,
    project, // Gantt needs project to get schedule data from
    startDate : '2020-02-16',
    endDate   : '2020-03-07',
    height    : 240,
    rowHeight : 50,
    barMargin : 15,
    columns : [
        { type : 'wbs', hidden : true },
        { type : 'name', width : 250, showWbs : true },
        { type : 'calendar' },
        { type : 'startdate' },
        { type : 'duration' },
        { type : 'constrainttype' },
        { type : 'constraintdate' },
    ],
    listeners: {
      presetChange() {
        this.fillTicks = true;
      },
    },
});

Here is the CodePen link: https://codepen.io/Nishant-Garg-the-lessful/pen/Pwzaqop?editors=101

You’ll notice that the task has an end date of February 20 at 7:00 AM. When I apply a 'Must Finish On' constraint to the task, using the same value for the constraint date as the end date (Feb 20 at 7:00 AM), the indicator is positioned incorrectly on the Gantt chart.

The indicator should appear at the end of the task, but instead it is placed at the second last tick from endDate.

Similar issue happens with ''Finish no later than' ,'Finish no later than' and 'Finish no earlier than' constraint types also.

Please let me know if this issue can be resolved by updating any logic.

Thanks.

Attachments
Screen Recording 2026-02-03 at 6.39.36 PM.mov
(22.61 MiB) Downloaded 230 times

Post by alex.l »

Hi,

Thank you for the report and clear description! Here is a ticket to track the status: https://github.com/bryntum/support/issues/12585
You can subscribe on ticket updates to be notified when it's done.

Unfortunately, I do not see any workaround for that, we have to wait for developer who will investigate this problem.

All the best,
Alex Lazarev

How to ask for help? Please read our Support Policy


Post by nishant.garg »

Hi team,
I noticed this ticket has been marked as fixed, but the issue is still reproducible on my CodePen. Could someone please take another look?

I’ve attached a video for reference.

Thanks.

Attachments
Screen Recording 2026-04-29 at 1.12.04 PM.mov
(11.8 MiB) Downloaded 78 times

Post by alex.l »

Thank you for the report! Reopened the ticket!

All the best,
Alex Lazarev

How to ask for help? Please read our Support Policy


Post Reply