How to use 'html.ObjectEl' in callbacks

Dear Team,

I am using html.ObjectEl to embedded external .html file based on dropdown values. I have tried different ways. Nothing is working for me. Any help is appreciated. Below is one example. Another one is using html.ObjectEl in layout instead of callback

Layout:

app.layout = dbc.Container([
    dbc.Row(id='row1',
            children=[
                dbc.Col([
                    html.Label('Select Year'),
                    dcc.Dropdown(id="year",
                                 options=[{'label': y, 'value': y} for y in ['2020 & 2021', 2020, 2021]],
                                 multi=False,
                                 value='2020 & 2021',
                                 style={'width': "100%"}
                                 )],
                    xs=12, sm=12, md=12, lg=12, xl=12)]),
    dbc.Row(id='pyLDAviz',
            children=[
                html.H3('Topics'),
                dbc.Col(id='pyLDA',
                        xs=12, sm=12, md=12, lg=12, xl=12),
            ],
            ),
],
    fluid=True)

Callback:

@app.callback(
    Output(component_id='pyLDA', component_property='children'),
    [Input(component_id='year', component_property='value')]
)
def update_pylda_graph(topics_slct_year):
    data = 'assets/temp.html'

    if topics_slct_year == '2020 & 2021':
        data = 'assets/pyLDA_2020_2021.html'
    if topics_slct_year == 2020:
        data = 'assets/pyLDA_2020.html'
    if topics_slct_year == 2021:
        data = 'assets/pyLDA_2021.html'

    pylda_graph = html.ObjectEl(
        # To my recollection you need to put your static files in the 'assets' folder
        data=data,
        type="application/pdf",
        style={"width": "80vw", "height": "100vh"},
    )
    return pylda_graph

without a callback, it is working for me

    dbc.Row(id='pyLDAviz',
            children=[
                dbc.Col([
                    html.H3('Topics'),
                    html.ObjectEl(
                        data='assets/pyLDA_2020_2021.html',
                        type="application/pdf",
                        style={"width": "80vw", "height": "100vh"},
                    )],
                    xs=12, sm=12, md=12, lg=12, xl=12)])

3 posts - 2 participants

Read full topic