Gantt Charts based on query results

I'm trying to use retool to generate Gantt Charts. I'm tring to do this with a custom component (if anyone knows how to do this without, I'm all ears), and I'm having trouble getting the data from the model into the HTML. Currently I'm trying this:

min: window.Retool.subscribe(function(model) {model.min}),
max: window.Retool.subscribe(function(model) {model.max})

Min and max are currently:

  project = {{}}

with a return data[0] transformer applied.

I have a feeling that this might have something to do with escape characters, but I'm not sure. Does anyone have any ideas?

Hey @jstaniforth, welcome to the fam :hugs:

The min and max values should be defined in your components 'value` field so you can access them.

I would change the query to include min and max and also formatDataAsArray in the query transformer.

Define your component value like so:

  min: queryName.min,
  max: queryName.max

and you can access it in your component via:

window.Retool.subscribe(function(model) {
  var min = model.min
  var max = model.max

Hope that helps (read more):v:


Thank you! This worked perfectly

@jstaniforth Were you able to successfully create a gantt chart using a custom component? Need one for my site as well and haven't had any luck.

Hi @paul.narup

Is this community post helpful? I put together an app export based on the example discussed there if you want to import it & check it out.

Thanks, @Tess, the app export was very helpful. Was able to get something basic up and running. It would be nice if there was a built-in component for this though, just for ease of use.

Agreed! I don't think this is on our near-term roadmap yet, but it is a feature request that we are tracking internally. I'll post here when we're able to ship something :slightly_smiling_face: