Open ddanieltan opened 4 days ago
Ah nice, this was on my mental to-do list for a bit so it is nice to see folks mentioning the same need.
I am wondering what the simplest solution might be for folks who know altair but not the vega ecosystem. I would for sure love a PR, but what do you link about adding an argument to the altair2html
function. Something like:
def altair2html(chart, full_width=True, full_height=False):
...
This way the end user needs to know less but can still get the chart to render the way they like and we might be able to handle all that is needed internally.
folks who know altair but not the vega ecosystem
I think I belong in that category 😅
I like your suggestion but I do have an issue trying to implement responsive height. Thus far, I can only get responsive width to work. Here are some screenshots for illustration.
Basic chart without size params
Chart with width=container
fills width of container
But chart with height=container
behaves unexpectedly
That's fine, lets drop the height. My thinking for the height was for consistently mostly, but it is fair to assume most people are interested in the width.
Issue: The current altair chart does not resize responsively with the
Div()
.I found this discussion in Altair's issues that describe a fix by adding some CSS for the vega-embed class. https://github.com/vega/altair/pull/2867
My suggestion to incorporate this fix:
altair_headers
altair2fasthtml()
, we default to include.properties(width="container", height=240)
This allows the chart to resize responsively based on the width of it parent container, with a fixed height. I experimented with setting both width and height to "responsive" but I did not get the desired result.
Here's an example FastHTML app that reproduces this responsively sized chart
Happy to submit a PR if you like the idea