--Créez un bouton dans le graphique et appuyez sur le bouton pour afficher / masquer le tracé.
pip
python
pip install plotly
pip install numpy
Basculez entre le 1er et le 3ème ordre avec 3 boutons, changez le titre et l'étiquette de l'axe y
See the Pen plotly_button by shunta-m (@shunta-m) on CodePen.
python
import numpy as np
import plotly.offline as offline
import plotly.graph_objs as go
x = np.linspace(-5, 5, 11)
y1 = x
y2 = x ** 2
y3 = x ** 3
trace1 = go.Scatter(
x=x,
y=y1,
name="y1",
mode="lines",
line=dict(color="red"),
visible=False,
showlegend=True
)
trace2 = go.Scatter(
x=x,
y=y2,
name="y2",
mode="lines",
line=dict(color="green"),
visible=False,
showlegend=True
)
trace3 = go.Scatter(
x=x,
y=y3,
name="y3",
mode="lines",
line=dict(color="blue"),
visible=False,
showlegend=True
)
data = [trace1, trace2, trace3]
#0ème des données comme état initial(trace1)Être visible
data[0].visible = True
"""
Description clé
active:Spécifiez le bouton enfoncé dans l'état initial, entrez l'index de la liste des boutons
x:coordonnées x, dans le graphique(Partie bleu clair)L'extrémité gauche de est 0,La bonne extrémité est 1, default=-0.05
xanchor:Où se trouve le bouton de coordonnées x(Bord droit, bord gauche, etc.)Correspondre, ("auto" | "left" | "center" | "right"), default="right"
y:coordonnées x, dans le graphique(Partie bleu clair)Le bord inférieur de est 0,Top 1, default=1
yanchor:Où boutonner la coordonnée y(Bord inférieur, bord supérieur, etc.)Correspondre, ( "auto" | "top" | "middle" | "bottom" ), default="top"
direction:Orientation des boutons, ( "left" | "right" | "up" | "down" ), default="down"
type:Liste déroulante ou bouton( "dropdown" | "buttons" ), default="dropdown"
buttons:Paramètres des boutons
"""
updatemenus = [dict(active=0, x=-0.05, xanchor="right", y=1, yanchor="top", direction="up", type="buttons", buttons=[
dict(label=trace1.name,
method="update",
args=[dict(visible=[True, False, False]),
dict(title="button_plotly_{}".format(trace1.name),
yaxis=dict(title="yaxis_{}".format(trace1.name), showspikes=True))]),
dict(label=trace2.name,
method="update",
args=[dict(visible=[False, True, False]),
dict(title="button_plotly_{}".format(trace2.name),
yaxis=dict(title="yaxis_{}".format(trace2.name), showspikes=True), )]),
dict(label=trace3.name,
method="update",
args=[dict(visible=[False, False, True]),
dict(title="button_plotly_{}".format(trace3.name),
yaxis=dict(title="yaxis_{}".format(trace3.name), showspikes=True))]),
])]
layout = go.Layout(
title="button_plotly_y1",
xaxis=dict(title="xaxis", showspikes=True, domain=[0.05, 1.0]),
yaxis=dict(title="yaxis_y1", showspikes=True),
font=dict(size=16),
legend=dict(orientation="h", yanchor="bottom", y=1.02, xanchor="right", x=1),
newshape=dict(line_color='#00ffff'),
hoverlabel=dict(font_size=20),
autosize=True,
updatemenus=updatemenus,
showlegend=True,
)
fig = dict(data=data, layout=layout)
offline.plot(fig, auto_open=True, include_plotlyjs="cdn", filename=r"./button_plotly.html",
config={'modeBarButtonsToAdd': ['drawline', 'drawopenpath', 'drawclosedpath', 'drawcircle', 'drawrect',
'eraseshape']})
python
"""
Description clé
active:Spécifiez le bouton enfoncé dans l'état initial, entrez l'index de la liste des boutons
x:coordonnées x, dans le graphique(Partie bleu clair)L'extrémité gauche de est 0,La bonne extrémité est 1, default=-0.05
xanchor:Où se trouve le bouton de coordonnées x(Bord droit, bord gauche, etc.)Correspondre, ("auto" | "left" | "center" | "right"), default="right"
y:coordonnées x, dans le graphique(Partie bleu clair)Le bord inférieur de est 0,Top 1, default=1
yanchor:Où boutonner la coordonnée y(Bord inférieur, bord supérieur, etc.)Correspondre, ( "auto" | "top" | "middle" | "bottom" ), default="top"
direction:Orientation des boutons, ( "left" | "right" | "up" | "down" ), default="down"
type:Liste déroulante ou bouton( "dropdown" | "buttons" ), default="dropdown"
buttons:Paramètres des boutons
"""
updatemenus = [dict(active=0, x=-0.05, xanchor="right", y=1, yanchor="top", direction="up", type="buttons", buttons=[
dict(label=trace1.name,
method="update",
args=[dict(visible=[True, False, False]),
dict(title="button_plotly_{}".format(trace1.name),
yaxis=dict(title="yaxis_{}".format(trace1.name), showspikes=True))]),
update menus est une liste de dictionnaires Créer des boutons pour la valeur de clé "boutons" dans le dictionnaire
label = trace1.name: paramètre d'étiquette de bouton
method =" update ": Pour changer (mettre à jour) l'affichage / non-affichage du graphique
method Parent: layout.updatemenus[].buttons[] Type: enumerated , one of ( "restyle" | "relayout" | "animate" | "update" | "skip" ) Default: "restyle"
args=[dict(visible=[True, False, False]),dict(...)]:
Contenu de la mise à jour du graphique, le premier dict est le paramètre d'affichage / non-affichage du tracé
Une trace s'affiche où la valeur visible est True.
ex) data = [trace1, trace2, trace3], donc trace1 est affiché dans le cas ci-dessus, sinon il est masqué.
Mettez à jour les autres mises en page avec le deuxième dict, cette fois, mettez à jour le titre du graphique et l'étiquette de l'axe y
python
layout = go.Layout(
title="button_plotly_y1",
xaxis=dict(title="xaxis", showspikes=True, domain=[0.05, 1.0]),
yaxis=dict(title="yaxis_y1", showspikes=True),
font=dict(size=16),
legend=dict(orientation="h", yanchor="bottom", y=1.02, xanchor="right", x=1),
newshape=dict(line_color='#00ffff'),
hoverlabel=dict(font_size=20),
autosize=True,
updatemenus=updatemenus,
showlegend=True,
)
Ajoutez le bouton créé par updatemenus = updatemenus à la mise en page
python
fig = dict(data=data, layout=layout)
offline.plot(fig, auto_open=True, include_plotlyjs="cdn", filename=r"./button_plotly.html",
config={'modeBarButtonsToAdd': ['drawline', 'drawopenpath', 'drawclosedpath', 'drawcircle', 'drawrect',
'eraseshape']})
création et sortie de figues
config = {...} ajoute un bouton de dessin en haut à droite
officiel Custom Buttons | Python | Plotly layout.updatemenus | Python | Plotly
layout.xaxis.domain
Quel est l'attribut de domaine écrit dans la mise en page de Plotly? --Qiita
Recommended Posts