Apexcharts.js: Setting height on chart creates a larger style tag surrounding it

Created on 30 Mar 2019  路  5Comments  路  Source: apexcharts/apexcharts.js

Image

Screen Shot 2019-03-30 at 19 58 27

Explanation

  • What is the behavior you expect?
    Setting height on the chart (380px in this case) I expect the resulting chart to be exactly that height

  • What is happening instead?
    A style tag is created surrounding the chart and a min-height style is set to larger than the height (394px in this case).

Most helpful comment

A new property chart.parentHeightOffset: 0 is added which will allow to remove the additional height appended.

All 5 comments

There is some additional padding of around 14px to give some breathing space to the chart.
I will try removing it and see how it looks.

A new property chart.parentHeightOffset: 0 is added which will allow to remove the additional height appended.

Thanks that would help a lot. It's hard to design panels around charts if you can't control their size.

Do you really need this at all though? Seems like people can easily add their own wrapper element and css styles if they want (eg: for padding)

Well, I made a mistake in the beginning by not providing inner padding which would give some breathing space by default.

Now, changing that seems difficult. So, I provided this new option to remove the extra height.

馃槉 I understand, I mean you might not need the style tag at all since anybody can just wrap the chart into their own div tag and place a margin

Was this page helpful?
0 / 5 - 0 ratings

Related issues

artfulrobot picture artfulrobot  路  3Comments

rudeayelo picture rudeayelo  路  3Comments

pribilinskiy picture pribilinskiy  路  3Comments

georgehardy picture georgehardy  路  3Comments

jlil picture jlil  路  3Comments