Background gridlines for timeline

GoJS
1

Is it possible to use background gridlines for timeline in a gantt-chart which looks like s follows:

image.png1228×152 14.6 KB

If not, then how to achieve such a diagram visualization using GOJS

2

Yes you could achieve this effect. We’ve already shown you Graduated panels and the Gantt chart sample. You can use both of those in a way similar to this sample, anchoring the timeline at the top and updating it when the viewport bounds change. You could also use the graduatedPointForValue/graduatedValueForPoint functions to determine the location of the current date/time similar to the mouse indicators in the sample linked above.

3

@jhardy, thanks for your response.

The sample shows the “ruler”, where only one graduated panel is there.

My requirement is to have two graduated panels.

How can i achieve this? Can i add one more graduated panel in the diagram shown in the sample’s link.

Thanks.

4

Yes, just like the example we showed you earlier, you can put two graduated panels in a vertical panel. Or you could use one graduated panel and draw some marks going up, and some going down.

5

@jhardy, Is it possible to have gantt-chart like diagram inside a node with a “graduated” panel which looks like this:

Thanks.

6

Yes, of course. You’ll want to implement a Binding for a Panel.itemArray and implement a Panel.itemTemplate for each bar. GoJS Item Arrays-- Northwoods Software

You’ll want to have either a Grid Panel or a Graduated Panel behind the Panel with the itemArray. That can be implemented by having a Table Panel holding both of those Panels, with the Grid or Graduated Panel stretching to fill the one cell.

For the second Panel showing the bars: