Height of graph inside toast does not resize automatically, width does

I’ve put a go.Scattergl inside a dcc.Toast which I made resizable. Now when resizing the width changes as it should, the height doesn’t. Please haalp

import dash
import dash_bootstrap_components as dbc
import dash_html_components as html
import dash_core_components as dcc
import plotly.graph_objects as go
import numpy as np

toast = {
     "position": "fixed",
     "resize": "both",
     'maxHeight':'100hv',
     'maxWidth': '100vw'
}

# stuff I've tried
style_fig = {
   # 'height': '100%' 
   # 'height': 'inherit'
}


# more stuff I've tried
config = {
    #'responsive': True
}

x, y = np.random.uniform(size=50), np.random.uniform(size=50)

fig = go.Figure(data=[go.Scattergl(x=x, y=y, mode='markers')])
fig.update_layout(margin=dict(l=0, r=0, t=0, b=0))



app = dash.Dash(external_stylesheets=[dbc.themes.BOOTSTRAP])

app.layout = dbc.Toast(children=html.Div([dcc.Graph(id='fig', figure=fig, config=config, style=style_fig)]),
                        id="my_toast", header="title", style=toast)

if __name__ == "__main__":
    app.run_server(debug=True)

One idea would to fire a callback, when the size of the div container or the toast itself changes… but is there a way to do that?

3 posts - 2 participants

Read full topic