Side by side graphs with Plotly and Dash?

📊 Plotly Python
1

I spent hours trying various suggestions from the web and nothing works or is outdated.
Can someone tell me what are/is currently the preferable way to achieve this?
I want to create line and candlestick charts, like three rows with three charts in each row, they have to be independent regarding data source, and refreshable with interval callback.
Best I got till now is graphs placed bellow each other.

Thanks everyone!

2

Hi @trader007,

From your question I understand that you need those graphs to be in the same row but in different columns (side by side placement).

You can use the row and col grid layout of the Dash Bootstrap Components to achieve any desired layout and placement for your graphs. Refer this page for how to use the dbc.Row and dbc.Col in your dash app.

This is how it would be for your usecase:

dbc.Row([                                                              #first row
      dbc.Col(dcc.graph(id='line-chart')),                             #col1
      dbc.Col(dcc.graph(id='candle-chart')),                           #col2
      dbc.Col(dcc.graph(id='third-chart')),                            #col3
])
3

Thanks, will have a look.

I tried a sample and got error:
AttributeError: module ‘dash_bootstrap_components’ has no attribute ‘themes’

What should I do?

1 Like