I am in the finishing stages of my first real Plotly Dash dashboard. I have run into a problem where I can’t add dcc.Markdown to any dcc.Graph elements.
It works fine with the dash.DataTable, as shown in the image below.
I am using Python v3.10, Dash v 2.6.2 & Plotly 5.10.
I have circled in red on the image above where my dcc.Markdown appears above a dcc. DashTable. I would like to do the same with the charts. I have placed red squiggles on the image where id like to place them.
No matter what I do I cannot get Markdown to work in a column with a chart.
Here is the code that works in a Row/Column with Markdown and a DataTable (yes I haven’t closed it off but you get the idea.
dbc.Row(
# Dash Data Table
[dbc.Col(
[dcc.Markdown('### Top Risks ###'),
dash_table.DataTable(
id='table1',
columns=[
{'name': 'Risk ID', 'id': 'risk_id', 'type': 'text', 'editable': False},
...
...
If I try the same but with a dcc.Graph
dbc.Col(
[dcc.Markdown('### Risk Breakdown ###'),
dcc.Graph(id='sun_burst1', figure={}, style={'height': '45vh'}),
width=4, lg={'size': 5, "offset": 0, 'order': 'second'}
]),
This generates an error and all the code is underlined in red in PyCharm.
TypeError: The
dash_bootstrap_components.Col
component (version 1.2.1) with the ID “Graph(id=‘sun_burst1’, figure={}, style={‘height’: ‘45vh’})” detected a Component for a prop other thanchildren
Prop id has value Graph(id=‘sun_burst1’, figure={}, style={‘height’: ‘45vh’})
Anyone any Ideas? Can I even have Markdown in a app with the dcc.Graph?