Explicit figure height replaced with autosize=True in callback
Personne n'a encore pris cette issue.
- Langage dominant
- Python
- Étoiles
- 18.8k
- Forks
- 2.8k
- Merge moyen
- 16 h 26 min
- PR mergées (30 j)
- 21
Description
I'm creating a plotly express line chart and seeing an explicit height=300 being replaced with autosize=True in the layout when used as an Input or State to a callback. This causes size issues when trying to serialize the chart and load it back later.
I'm using Plotly 5.10.0, Dash 2.6.2 with Python 3.10.7.
The following demonstrates the problem.
import plotly.express as px
import dash
from dash import Dash, dcc, html, Output, Input, State
import dash_bootstrap_components as dbc
@dash.callback(
Output("main-content", "children"),
Output("loaded-values", "children"),
Input("load-button", "n_clicks"),
prevent_initial_call=True
)
def add_chart(clicks):
df = px.data.stocks()
df = df.melt(id_vars="date", value_name="price", var_name="stock")
fig = px.line(
df,
x="date",
y="price",
color="stock",
title="Stock Prices",
height=300,
)
info = {
"width": fig.layout.width,
"height": fig.layout.height,
"autosize": fig.layout.autosize,
}
return dcc.Graph(figure=fig, id="plot"), f"{clicks}: {info}"
@dash.callback(
Output("callback-values", "children"),
# Note: height=300 is seen when triggered by main-content, but autosize=True
# is seen when triggered by observe-button
Input("observe-button", "n_clicks"),
Input("main-content", "children"),
prevent_initial_call=True
)
def observe_chart(clicks, content):
ctx = dash.callback_context
info = {}
for k in ["width", "height", "autosize"]:
try:
info[k] = content["props"]["figure"]["layout"][k]
except Exception as e:
info[k] = None
return f"{clicks}: {info}"
app = Dash(external_stylesheets=[dbc.themes.BOOTSTRAP])
app.layout = dbc.Container([
dbc.Button("Load", id="load-button", class_name="m-2"),
dbc.Button("Observe", id="observe-button", class_name="m-2"),
html.Br(),
dbc.Label("Loaded Chart"),
dbc.Container([], id="main-content"),
dbc.Label("Loaded Layout Values"),
dbc.Container(id="loaded-values"),
dbc.Label("Callback Layout Values"),
dbc.Container(id="callback-values"),
])
app.run_server(debug=True)
Click the "Load" button to "load" the chart. The layout parameters of interest will be shown under "Loaded Layout Values" and the "Callback Layout Values" will be correct. Then click the "Observe" button to update the "Callback Layout Values". Instead of a height=300 there will be an autosize=True.
With the explicit height being discarded the user selected size can't be serialized and loaded later...
Guide de contribution
Ouvrir le guide de contribution
Par où commencer
- Lisez l'issue en entier, puis le guide de contribution du projet.
- Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
- Forkez le dépôt et travaillez sur une branche.
- Ouvrez une pull request qui référence le numéro de l'issue.
Piste de recherche
Exécutez la reproduction Python fournie, en vous concentrant sur les callbacks add_chart et observe_chart ainsi que sur la figure de dcc.Graph transmise entre eux. Comparez le layout de la figure avant et après la sérialisation du callback ; le travail est terminé lorsqu’une hauteur explicite de 300 reste disponible dans les données du callback observé au lieu d’être remplacée par autosize=True.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Évaluation
- Stack technique
- plotly, python
- Domaine
- api
- Type d'issue
- Bug
- Difficulté
- 3/5
- Temps estimé
- 1-2 jours
- Activité
- À l'abandon
- Clarté
- Plutôt claire
- Accessibilité débutants
- 35/100