Search code examples
pythonplotlyplotly-python

python plotly: how to stretch line chart out to the end


I have two subplots of line chart, and I'd like the line to start from the very beginning and stretch it all the way to the end. It seems like if I were to draw an area chart, it stretches it out automatically, but when I try it with a line chart, it does not stretch to the end.

The line charts don't stretch from the beginning to the end as shown below:

line_chart

Whereas, if I were to draw an area chart by inserting stackgroup = "one", it automatically starts from the very beginning and stretches out to the end:

area_chart

Here is the reproducible example:

import numpy as np
import pandas as pd
import plotly.graph_objects as go
from plotly.subplots import make_subplots 

rng = pd.date_range('2022-04-09', periods=20, freq='D')
np.random.seed(42)
first_df = pd.DataFrame({ 'Date': rng, 'Val' : np.random.randn(len(rng))}) 
first_df['Type'] = 'A'

second_df = pd.DataFrame({ 'Date': rng, 'Val' : np.random.randn(len(rng))}) 
second_df['Type'] = 'B'

final_df =  pd.concat([first_df,second_df]).sort_values(by = 'Date')
final_df['Is_Weekend'] = np.where((final_df['Date'].dt.weekday == 5), 1, 0 )

A_df = final_df[final_df['Type']=='A']
B_df = final_df[final_df['Type']=='B']

fig = make_subplots(rows=2, cols=1,
                    shared_xaxes=True)


fig.add_trace(go.Scatter(x=A_df['Date'], 
                         y = A_df['Val'], 
                         line_color = 'orange',
                         mode = 'lines+markers',
                         showlegend = True, name = "A"),
              row=1, col=1,
              secondary_y = False)


fig.add_trace(go.Scatter(x=B_df['Date'], 
                         y = B_df['Val'], 
                         line_color = 'blue',
                         mode = 'lines+markers',
                         showlegend = True, name = "B"),
              row=2, col=1,
              secondary_y = False)


fig.update_layout(legend_traceorder="reversed", hovermode = "x unified", yaxis_tickformat = ".1%")

fig.show()

Solution

  • Change this line:

    fig.update_layout(legend_traceorder="reversed", hovermode = "x unified", yaxis_tickformat = ".1%")
    

    into:

    fig.update_layout(legend_traceorder="reversed", hovermode = "x unified", yaxis_tickformat = ".1%",
                      xaxis_range=[A_df['Date'][0],A_df['Date'][len(A_df)-1]])
    

    Result:

    updated plot