# Side by side graphs with Plotly and Dash?

**URL:** <https://community.plotly.com/t/side-by-side-graphs-with-plotly-and-dash/55493>\
**Category:** 📊 Plotly Python\
**Created:** [August 12, 2021, 5:29am UTC](https://community.plotly.com/t/side-by-side-graphs-with-plotly-and-dash/55493 "2021-08-12T05:29:52Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![trader007](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/trader007/32/15543_2.png) [@trader007](https://community.plotly.com/u/trader007)\
**Post date:** [August 12, 2021, 5:29am UTC](https://community.plotly.com/t/side-by-side-graphs-with-plotly-and-dash/55493/1 "2021-08-12T05:29:52Z")

</div>

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!

---

<div class="post-metadata">

**Author:** ![atharvakatre](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/atharvakatre/32/14713_2.png) [@atharvakatre](https://community.plotly.com/u/atharvakatre)\
**Post date:** [August 12, 2021, 7:34am UTC](https://community.plotly.com/t/side-by-side-graphs-with-plotly-and-dash/55493/2 "2021-08-12T07:34:40Z")

</div>

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](https://dash-bootstrap-components.opensource.faculty.ai/) to achieve any desired layout and placement for your graphs. Refer this [page](https://dash-bootstrap-components.opensource.faculty.ai/docs/components/layout/) for how to use the `dbc.Row` and `dbc.Col` in your dash app.

This is how it would be for your usecase:

```auto
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
])

```

---

<div class="post-metadata">

**Author:** ![trader007](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/trader007/32/15543_2.png) [@trader007](https://community.plotly.com/u/trader007)\
**Post date:** [August 12, 2021, 8:08am UTC](https://community.plotly.com/t/side-by-side-graphs-with-plotly-and-dash/55493/3 "2021-08-12T08:08:54Z")

</div>

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?