Above you can see 2 column graphs. The first one doesnt have any labels and the right one has 8 of them. This causes the graph on the right the become really small in height.
How can i set the height of the graph to a set height so that a variable amount of labels dont change the height.
Hi @Michel k ,
the height you can set in Outsystems is indeed the full height of the widget, and highcharts makes space inside of that for the legend at the expense of the actual chart area.
You can make highcharts calculate the total height, adding some to it dependent on the used space for the legend. That means, that more legend, will make your total chart widget height bigger, pushing any page content below the chart down.
I had found an example online doing it in the load event, but that didn't seem to do it, as on the load time, if your data is coming from the server, the real legend size is not known yet. See the load console.logs, if you test you'll see the legend height there just equals the padding.
So i moved this to the redraw event, but you have to be real carefull with this, as it could land you in an endless loop of redrawing, so only change the height if needed.
Also, as this is executed several times over the lifetime of the chart (for example, it will also keep charts adjusted when resizing the window to such an extend that the legend needs more or less space) you have to start from the same starting height of the chart, I've done that by hardcoding it here, but you might find more clever way.
See attached oml.
I think alternative, if you want to keep it in the load event, is to put the chart inside an If IsDataFetched or something like that, haven't tried it.
Dorine
or maybe even move it to the render instead of the redraw, you'll have to test which works best, I think, sometimes the redraw doesn't do it for me.
here's slighly changed oml doing it in the render, and with a bit less console.log
Hello Dorine,
Your solution worked! Thank you very much!
Best regards,
Michel
Hi Michel,
Have you tried setting up the height property in the chart properties?
Kind Regards,João
Hi Joao,
Thank you for your quick response.
Yes i have tried this but this refers to the total height of the chart, including the lagenda underneath the graph. So it makes the whole thing bigger or smaller.
My question is specifically about the graph part of the widget.
Kind Regards,