Dashboard width dynamically changes but not height

[jenniferand]

Hi,

We're trying to have our automatic sized dashboard dynamically resize when the user's window size changes. I'm using your simple code in basicEmbeddingWebComponent.html (minus the definition of the div container where the style is set) and have noticed that the width of the dashboard changes when I make the window narrower but the height does not change when I make the window shorter/taller. In fact, the height seems to be stuck at 600px. The height of the dashboard itself is definitely automatic.

Would it be possible to add the same dynamic functionality to height that is currently applied to width?

Thanks

[MicahBCode]

That would definitely be something we would appreciate as well

[anyoung-tableau]

Hi @jenniferand and @MicahBCode, the Embedding API v3.11 that ships with Tableau 2024.3 exposes a new resize method on the Viz and AuthoringViz classes. It's the same method the Embedding API uses internally to dynamically set the size of the embedded iframe based off the dimensions of the <tableau-viz>'s parent container when width/height attributes are not provided. With this method now being public, you can call it during a window resize event for example.

External documentation hasn't updated yet but will look something like this:

Use this method to readjust the dimensions of the embedded viz in response to things like a window resize, device orientation change, or parent container resize.

window.addEventListener('resize', () => viz.resize());

// or

new ResizeObserver(() => viz.resize()).observe(viz.parentElement);