Multiple Gantt charts on one page interfere with each other

[Tom Nielsen]

I am trying to create a page with two Gantt charts that I am expecting to operate independently. Specifically, i am trying to create a resource utilisation view below the main task gantt chart. See e.g. https://www.teamgantt.com/what-is-a-gantt-chart/managing-resources-gantt-chart (Planning and resourcing in a single view).

I am using the iife build, two divs with different ids, and call new SvelteGantt twice.

const gantt = new SvelteGantt({ 
  target: document.getElementById('div1'), 
  props: {...}
})
const rgantt = new SvelteGantt({ 
  target: document.getElementById('div2'), 
  props: {...}
})

I expect to see the two gantt charts independently.

However the second intended Gantt chart appears twice with the same content repeated. That is, both Gantt charts displayed have the rows and tasks of the second chart.

If anyone can point me in the right direction I may be able to assist with implementing a fix.

[Labs]

This is a HUGE show breaker.

Please, any directions on that? I just opened two distinc projects on my application and the first one oppened became the second one.

Please help?

[Ante Novokmet]

Sorry for this issue. The main issue is that each Gantt instance uses the same store variables defined in https://github.com/ANovokmet/svelte-gantt/blob/master/src/core/store.ts so they display the identical data. The fix would be a PR where new ones are instantiated in eg. Gantt.svelte and shared using setContext().

[Labs]

Hi! I've no experience with svelte, I'm using your (great btw) component in a vue based project, and it has the concept of multiple simultaneous proccess (think it as "forms") being running at the same time by the user. As so, its fairly normal to have two or more gantt proccess browsing different projects at one given time.

With all due respect for your time, is there a ETA that for a fix like that? Asking because I'm now 90% done with the component integration on our project and this problem means maybe I'll have to start it all over again from scratch.

Thank you

[Tom Nielsen]

Hey @labs20 my workaround is to run each Gantt chart in an iframe - this works, I can display two Gantt charts to the user on the same page.