在 Plotly Python 中添加辅助轴

Question

我正在使用 Dash 图形对象，而且我对它还很陌生。我正在尝试传入一个图表，该图表在同一个图中有 2 个散点图和一个条形图，但我希望条形图（绿色）位于它自己的辅助 y 轴上，所以它看起来比这里更好：

现在根据我对 Dash 的了解，我必须传递一个 go.Figure() 对象，所以我有一个定义 data 和 layout 的函数。我在 plotly 文档中看到您可以使用 plotly express 添加辅助轴，但我不确定如何在我的框架工作中做到这一点。任何帮助将不胜感激！

这是我的代码：

def update_running_graph(n_intervals):
    df = pd.read_csv(filename)

    trace1 = go.Scatter(x=df['Timestamp'],
                        y=df['CLE'],
                        name='Crude',
                        mode='lines+markers')
    trace2 = go.Scatter(x=df['Timestamp'],
                        y=df['y_pred'],
                        name='Model',
                        mode='lines+markers')
    trace3 = go.Bar(x=df['Timestamp'],
                    y=df['ModelDiff'],
                    name='Diff',
                    )
    data = [trace1, trace2,trace3]
    layout = go.Layout(title='CLE vs Model')
    return go.Figure(data=data, layout=layout)

Answer 1

要在破折号中添加辅助 y 轴，您可以执行以下操作：

def update_running_graph(n_intervals):
    df = pd.read_csv(filename)

    trace1 = go.Scatter(x=df['Timestamp'],
                        y=df['CLE'],
                        name='Crude',
                        mode='lines+markers',
                        yaxis='y1')
    trace2 = go.Scatter(x=df['Timestamp'],
                        y=df['y_pred'],
                        name='Model',
                        mode='lines+markers',
                        yaxis='y1')
    trace3 = go.Bar(x=df['Timestamp'],
                    y=df['ModelDiff'],
                    name='Diff',
                    yaxis='y2'
                    )
    data = [trace1, trace2,trace3]
    layout = go.Layout(title='CLE vs Model',
                       yaxis=dict(title='Crude and Model'),
                       yaxis2=dict(title='Moddel Difference',
                                   overlaying='y',
                                   side='right'))
    return go.Figure(data=data, layout=layout)

您可以添加更多的 y 轴，它们总是需要具有yi 的形式，其中 i 是第 i 个轴。然后在布局中可以用yaxisi=dict(...)指定第i轴的布局。

Answer 2

这个documentation page 应该有用。只需修改以适合您的代码，因为 trace1 和 trace2 似乎处于相同的比例，只需将 trace3 设置为辅助轴比例，您就应该进行设置。下面是一个只有 2 个的示例，但添加第三个应该不会太难。

import plotly.graph_objects as go
from plotly.subplots import make_subplots

# Create figure with secondary y-axis
fig = make_subplots(specs=[[{"secondary_y": True}]])

# Add traces
fig.add_trace(
    go.Scatter(x=[1, 2, 3], y=[40, 50, 60], name="yaxis data"),
    secondary_y=False,
)

fig.add_trace(
    go.Scatter(x=[2, 3, 4], y=[4, 5, 6], name="yaxis2 data"),
    secondary_y=True,
)

# Add figure title
fig.update_layout(
    title_text="Double Y Axis Example"
)

# Set x-axis title
fig.update_xaxes(title_text="xaxis title")

# Set y-axes titles
fig.update_yaxes(title_text="<b>primary</b> yaxis title", secondary_y=False)
fig.update_yaxes(title_text="<b>secondary</b> yaxis title", secondary_y=True)

fig.show()

干杯！