Timeline (Gantt chart)

[Scott McKissock]

We need a way to display a Gantt chart - kind of a stacked row chart, but where each row's left hand side could be to the right of the y axis.

Has anyone done this?  If not, could it be done by making a new chart using the row chart as a starting point? Or line chart?     

Thanks for the library - we're getting a lot out of it.  

[Matt Traynham]

Yeah, it's not currently supported.  A row may be a good place to start looking for examples on how to render the rows themselves, but calculating x/x' positions of the start & ends is something that is going to be on you.  Since Gantt charts are time-oriented, you're x-Axis scale will be a d3.time.scale, instead of the row's numeric scale.  From there, you'll want to calculate the start/end first to get the domain of that scale (crossfilter has a heapsort, so no extra libraries needed).  Then, you'll want to calculate the start & end positions using that scale for each bar. Height of the bar is different story... how many bars are rendering at one time?  Maybe you're y-axis is static, which makes it easier.

Luckily for you, I googled 'd3 gantt' chart.  This would be a good starting place if you wanted to merge dc's nice filtering features with someone's gannt prototype:

https://github.com/dk8996/Gantt-Chart

[Matt Traynham]

Another good example:

http://codepen.io/anon/pen/kyKeI 

[Scott McKissock]

Thanks - I'm new to d3 - just able to use dc - but I can probably figure out how to do this.  It will work well in our app, since users have already figured out how to use the row and pie charts for filtering.  Expect more questions...