How to show all legend in conditional plot and show several legends in plotly

📊 Plotly Python
1

I am trying to make a plot similar to the next one:

image
image1291×665 59.7 KB

While I have until now is:

image
image1889×833 73.6 KB

Which is generated with the following code:

import plotly.io as pio
pio.renderers.default='browser'

import plotly.graph_objects as go
import pandas as pd
import numpy as np

input_df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/finance-charts-apple.csv')
threshold =2.8
name_yaxis="Gap"
input_df["AAPL.High"] = (input_df["AAPL.High"]-min(input_df["AAPL.High"]))*(threshold)/(max(input_df["AAPL.High"])-min(input_df["AAPL.High"]))+np.random.uniform(0.3,0.4,1)


fig = go.Figure()

fig.add_trace(go.Scatter(x=input_df['Date'], y=np.repeat(threshold,len(input_df)),
        mode='lines',
        name="Threshold",
        line=dict(color="#EBB81C",dash='dash')))


fig.add_trace(go.Scatter(x=input_df['Date'], y=input_df['AAPL.High'],
        mode='lines',
        name='Rolling average(mm)',
        line = dict(color="#C4C4C4")
            )
    )


fig.add_trace(go.Scatter(x=input_df['Date'], y=input_df['AAPL.High'],
        mode='markers',
        marker_size=12,
        name='Healthy(mm)',
        marker=dict(color=( (0 < input_df['AAPL.High']) & (input_df['AAPL.High'] < threshold)).astype('int'),
                    colorscale=['#A51890', '#3BBFFE']
                    ),
        showlegend=True
            )
    )





fig.update_layout(
    
    xaxis = dict(title="Flight Operation date", tickfont=dict(
            family="Roboto",size = 8),  gridcolor='#e8e9eb'), # xaxis settings
    
    
            
    yaxis = dict(title=name_yaxis, tickfont=dict(
            family="Roboto",size = 10), gridcolor='#e8e9eb'), # yaxis settings
    
    plot_bgcolor = "white", # set background color
    
    legend = dict(title="<b>Health status<b>",traceorder="reversed",font = dict(family = "Roboto", size = 10)) # legend settings
)

I have a couple of questions about the legend:

  1. How to show the purple color into the legend?
  2. How to create multiple legends as the desired image?

Thanks in advance.