Search code examples
pythonplotlyaxis-labels

In Plotly, how to change axis titles dynamically when switching between different graphs using an Update button


I have 3 separate scatter plots that can be selected using buttons, with only the dependent variable changing between them. How do I code the yaxis_title to change with each button selected? I haven't found any demonstration of this in their tutorials. I have attached code from the sample tutorial as an example.

import plotly.graph_objects as go

import pandas as pd

# Load dataset
df = pd.read_csv(
  "https://raw.githubusercontent.com/plotly/datasets/master/finance-charts-apple.csv")

df.columns = [col.replace("AAPL.", "") for col in df.columns]

# Initialize figure
fig = go.Figure()

# Add Traces

fig.add_trace(
go.Scatter(x=list(df.index),
           y=list(df.High),
           name="High",
           line=dict(color="#33CFA5")))

fig.add_trace(
go.Scatter(x=list(df.index),
           y=[df.High.mean()] * len(df.index),
           name="High Average",
           visible=False,
           line=dict(color="#33CFA5", dash="dash")))

fig.add_trace(
go.Scatter(x=list(df.index),
           y=list(df.Low),
           name="Low",
           line=dict(color="#F06A6A")))

fig.add_trace(
go.Scatter(x=list(df.index),
           y=[df.Low.mean()] * len(df.index),
           name="Low Average",
           visible=False,
           line=dict(color="#F06A6A", dash="dash")))

# Add Annotations and Buttons
high_annotations = [dict(x="2016-03-01",
                     y=df.High.mean(),
                     xref="x", yref="y",
                     text="High Average:<br> %.2f" % df.High.mean(),
                     ax=0, ay=-40),
                dict(x=df.High.idxmax(),
                     y=df.High.max(),
                     xref="x", yref="y",
                     text="High Max:<br> %.2f" % df.High.max(),
                     ax=0, ay=-40)]
low_annotations = [dict(x="2015-05-01",
                    y=df.Low.mean(),
                    xref="x", yref="y",
                    text="Low Average:<br> %.2f" % df.Low.mean(),
                    ax=-40, ay=40),
               dict(x=df.High.idxmin(),
                    y=df.Low.min(),
                    xref="x", yref="y",
                    text="Low Min:<br> %.2f" % df.Low.min(),
                    ax=0, ay=40)]

fig.update_layout(
   updatemenus=[
    dict(
        type="buttons",
        direction="right",
        active=0,
        x=0.57,
        y=1.2,
        buttons=list([
            dict(label="None",
                 method="update",
                 args=[{"visible": [True, False, True, False]},
                       {"title": "Yahoo",
                        "annotations": []}]),
            dict(label="High",
                 method="update",
                 args=[{"visible": [True, True, False, False]},
                       {"title": "Yahoo High",
                        "annotations": high_annotations}]),
            dict(label="Low",
                 method="update",
                 args=[{"visible": [False, False, True, True]},
                       {"title": "Yahoo Low",
                        "annotations": low_annotations}]),
            dict(label="Both",
                 method="update",
                 args=[{"visible": [True, True, True, True]},
                       {"title": "Yahoo",
                        "annotations": high_annotations + low_annotations}]),
        ]),
    )
])

# Set title
fig.update_layout(
    title_text="Yahoo",
    xaxis_domain=[0.05, 1.0]
)

fig.show()

Solution

  • Changing the xy-Axis Titles with Dropdown Menu Here are the same questions as you and the answers.

            buttons=list([
            dict(label="None",
                 method="update",
                 args=[{"visible": [True, False, True, False]},
                       {"title": "Yahoo",
                        "xaxis": {"title": "Date"},
                        "yaxis": {"title": "High Price - Dollars"},
                        "annotations": []}]),