Skip to content

Advanced component view: mainTemplate does not scroll in sync with sideTemplate #543

@KeyTurns

Description

@KeyTurns

Description
When using the “advanced” API ( with separate sideTemplate and mainTemplate), only the side panel scrolls vertically. The main timeline area remains fixed, so bars and dates fall out of alignment with their group labels.

Steps to Reproduce

Import and render in advanced mode:

<ngx-gantt-root [sideWidth]="300">
  <ng-template #sideTemplate>
    <!-- group labels -->
  </ng-template>
  <ng-template #mainTemplate>
    <!-- gantt bars -->
  </ng-template>
</ngx-gantt-root>

Populate sideTemplate with enough groups that a vertical scrollbar appears.

Scroll down in the viewport.

Actual Behavior

The sideTemplate content scrolls, but the mainTemplate remains stuck at the top.

Bars and group labels no longer line up once you scroll.

Expected Behavior
Both templates should scroll in lock-step: the timeline (mainTemplate) and the group list (sideTemplate) should stay aligned vertically.

Reproduction Repository
http://gantt.ngnice.com/components/advanced

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions