Initial value for property updated within callback taking hoverData

@ocerafa wrote:

I have some image polar-spec that is updated within a callback based on hoverData from graph-timeseries graph (the second callback in the example below). This works nicely however I have struggled to find out how to have the polar-spec image initialised when the app is started (i.e., before I have hovered on graph-timeseries). Is there any way I could have a default image that is shown before any hovering event in this case please?

Thanks

body = html.Div(
    [
        dbc.Col(
            html.Div(
                dcc.Graph(id="graph-timeseries")
            ),
        width=7
        ),
        dbc.Col(
            html.Div(
                children=[
                    html.Img(
                        id="polar-spec",
                        style={
                            'height' : '100%',
                            'width' : '100%',
                            'float' : 'left',
                            'position' : 'relative',
                        },
                    )
                ]
            ),
            width=2
        ),
        dcc.Interval(
            id='interval-component',
            interval=3600 * 1000,
            n_intervals=0
        )
    ]
)


app.layout = html.Div([body])


@app.callback(
    Output('graph-timeseries', 'figure'),
    [Input('interval-component', 'n_intervals')]
)
def update_figure(n):
    df = pd.read_gbq(sql, project_id=PROJECT)
    return show_timeseries(df)


@app.callback(Output('polar-spec', 'src'),
              [Input('graph-timeseries', 'hoverData')])
def update_polar(hoverData):
    try:
        dtime = parse(hoverData["points"][0]["x"])
        src = show_spectra(dtime)
    except Exception as exc:
        src = ""
    return src

Posts: 3

Participants: 2

Read full topic