How can I display the second axis in a clustered bar and line chart?

📊 Plotly Python
1

I have the following script

import numpy as np
# Sample data
X = np.arange(10)
Y1 = np.sin(X)
Y2 = np.cos(X)
Z = np.array([2, 1, 4, 3, 5, 3, 1, 2, 4, 5])
# Create a Plotly figure
fig = go.Figure()

# Add line traces
fig.add_trace(go.Scatter(x=X, y=Y1, mode='lines', name='Sin(X)', line=dict(color='blue')))
fig.add_trace(go.Scatter(x=X, y=Y2, mode='lines', name='Cos(X)', line=dict(color='green')))

# Add bar trace
fig.add_trace(go.Bar(x=X, y=Z, name='Z value', marker_color='red', opacity=0.4, width=0.3))

# Update layout
fig.update_layout(title='Clustered Bar and Line Chart (Plotly)',
                  xaxis_title='X-axis',
                  yaxis=dict(title='Y-axis (Line)', titlefont=dict(color='black')),
                  yaxis2=dict(title_text='Z-axis (Bar)', titlefont=dict(color='black'), overlaying='y', side='right'))

# Show the plot
fig.show()

However this plot has one defect: It does not display the yaxis2 title ‘Z axis(Bar)’ on the right.

How can I make the title appear?

And also I would like for the two axes to have different values. So the scatter that only goes to 1 will have values till 1 but the bars that go to 5 should be much smaller.

2

Did you try to use make_subplots? Please check if this below is your goal.

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

# Sample data
X = np.arange(10)
Y1 = np.sin(X)
Y2 = np.cos(X)
Z = np.array([2, 1, 4, 3, 5, 3, 1, 2, 4, 5])
# Create a Plotly figure
fig=make_subplots(specs=[[{"secondary_y":True}]])

# Add line traces
fig.add_trace(go.Scatter(x=X, y=Y1, mode='lines', name='Sin(X)', line=dict(color='blue')),secondary_y=False)
fig.add_trace(go.Scatter(x=X, y=Y2, mode='lines', name='Cos(X)', line=dict(color='green')),secondary_y=False)

# Add bar trace
fig.add_trace(go.Bar(x=X, y=Z, name='Z value', marker_color='red', opacity=0.4, width=0.3),secondary_y=True)

# Update layout
fig.update_layout(title='Clustered Bar and Line Chart (Plotly)',
                  xaxis_title='X-axis',
                  yaxis=dict(title='Y-axis (Line)', titlefont=dict(color='black')),
                  yaxis2=dict(title_text='Z-axis (Bar)', titlefont=dict(color='black'), overlaying='y', side='right'))

# Show the plot
fig.show()

newplot
newplot984×525 33.8 KB

3

Thanks! This is the solution I was looking for . (In the meantime I also found one using
fig.add_trace(go.Bar(x=X, y=Z, yaxis='y2', name='Z value', marker_color='red', opacity=0.4, width=0.3))

Is there any way to:

  1. Display the grid only of the left axis but not the right one?
  2. Modify the range of the right one so that to make the maximum value (5) appear much smaller (something like setting the max to 10)

Thanks!