BUG : Sliders + 4x1 makesubplot including tables & bars

Hi plotly team and users,

I ask your help for an issue with slider & subplots .
Indeed : my goal is to print a plotly dashboard with 4 items :

  • table
  • chart
  • chart
  • table

But i want to get this “trace” dynamic with a date slider.
The problem is that with the plotly library, my code has issues on displaying every graphs while changing the on d: Sometimes it displays the first table, sometimesthe last and sometimes only the charts that are corrupted (displaying 3 datas per x-axis number instead of one) and it sometimes display a wrong data which is not corresponding to the slider step.: as showed here :

I give you my code for any suggestions.

import plotly.graph_objects as go
import numpy as np

# Create figure
fig2 = make_subplots(
    rows=4, cols=1,
    specs=[[{"type": "table"}],
           [{"type": "bar"}],
           [{"type": "bar"}],
           #[{"type": "scatter"}],
           [{"type": "table"}]],
    vertical_spacing=0.10,
    subplot_titles=("Recommendations",
                    "Accuracies - Histogram",
                    "Price Drivers - Histogram",
                    #"Price Corridors",
                    "Price bands")
)


# size of slider
size = len(final_agg_preds_history_by_reco_horizon[1].predictions())

# Add traces, one for each slider step
for step in range(0,len(L_acc)):

    rb_table = rb_plot(L_horizon=[i for i in range(1,13)], #actualize with step = real date
                       predictions=final_agg_preds_history_by_reco_horizon,
                       start=0,
                       stop=step,
                       user_name = 'PET Bottle Grade Spot FOB China')[0]


    df_tb = tb_plot(L_horizons = [i for i in range(1,13)],
           predictions=final_agg_preds_history_by_reco_horizon,
           input_data=input_data,
           start_index=0,
           stop_date=str(L_acc[step].index.values[0])[:-19],
           threshold=20)

    fig2.append_trace(
        go.Table(
        visible=False,
        header=dict(
            height=20,
            values=rb_table.columns,
            font=dict(size=10)
        ),
        cells=dict(
            height=20,
            values=[rb_table[k].tolist() for k in rb_table.columns],
            font=dict(size=10))
        ),
        row=1,
        col=1
    )



    fig2.append_trace(
        go.Bar(
            visible=False,
            name="accuracy",
            x=L_acc[step].columns,
            y=L_acc[step].values.squeeze(),
            marker_color='indianred'
        ),
        row=2,
        col=1
    )

    fig2.append_trace(
        go.Bar(
            visible=False,
            x=df_priced[df_priced.index==str(L_acc[step].index.values[0])[:-19]].columns,
            y=df_priced[df_priced.index==str(L_acc[step].index.values[0])[:-19]].values.squeeze(), ##extract the row for date selected
            name = 'poids',
            marker_color='lightsalmon'
        ),
        row=3,
        col=1
    )

    fig2.append_trace(
        go.Table(
        visible=False,
        header=dict(
            height=10,
            values=df_tb.columns,
            font=dict(size=10),
            align="left"
        ),
        cells=dict(
            height=15,
            values=[df_tb[k].tolist() for k in df_tb.columns],
            align = "left",
            font=dict(size=10)
        )
        ),
        row=4,
        col=1
    )



# Make 10th trace visible
fig2.data[50].visible = True

# Create and add slider
steps = []
for i in range(len(L_acc)):
    step = dict(
        method="restyle",
        args=[{"visible": [False] * len(L_acc)},
              {"title": "Date : " + str(L_acc[i].index.values[0])[:-19]}],  # layout attribute
    )
    step["args"][0]["visible"][i] = True  # Toggle i'th trace to "visible"
    steps.append(step)



sliders = [dict(
    active=10,
    currentvalue={"prefix": "Date : "},
    pad={"t": 50},
    steps=steps
)]

fig2.update_layout(
    height=800,
    showlegend=False,
    title_x=0.5,
    sliders=sliders
)


fig2.layout.sliders = sliders

go.FigureWidget(fig2)

fig2.show()

and the differents datasets : (bars one)
image

(table one) at the last step :


image

If you guys have any suggestions / solution to build my idea, I would be really grateful.

Or do you think i mandatory have to switch to dash ?

Have a good day !

Matthieu