# Two (Many) subplots, Two dropdown buttons

**URL:** <https://community.plotly.com/t/two-many-subplots-two-dropdown-buttons/42123>\
**Category:** 📊 Plotly Python\
**Created:** [July 8, 2020, 2:57am UTC](https://community.plotly.com/t/two-many-subplots-two-dropdown-buttons/42123 "2020-07-08T02:57:57Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![astro](https://avatars.discourse-cdn.com/v4/letter/a/9dc877/32.png) [@astro](https://community.plotly.com/u/astro)\
**Post date:** [July 8, 2020, 2:57am UTC](https://community.plotly.com/t/two-many-subplots-two-dropdown-buttons/42123/1 "2020-07-08T02:57:57Z")

</div>

Hi everyone,

I am trying to have two columns each being controlled by its own dropdown list, I wan’t to be able to use each dropdown to show different heatmaps

For example:  
Q1 and Q2

 ![1and2](https://us1.discourse-cdn.com/flex024/uploads/plot/original/2X/6/6a4458686e46e5ad1cb006b803560650e588fee8.png)

For example:  
Q2 and Q8

 ![2and8](https://us1.discourse-cdn.com/flex024/uploads/plot/original/2X/e/e71b58f834fccd22296592907b5c95429ac70631.jpeg)

So essentially it is a side-by-side comparison

So far I have this code, but it only gives I dropdown, and the positions for the plots are fixed, which means Q2 is allocated to 1,2, and can never be 1,1

```auto
import pandas as pd
import numpy as np
import time
import sys
import re
import plotly.graph_objects as go
from plotly.subplots import make_subplots

#Read CSV File
data=pd.read_csv("data.csv")
labels =["Q1","Q2","Q8"]

#fig = go.Figure()
#fig = make_subplots(2,2)
fig = make_subplots(
    rows=1, cols=2, 
)
fig.add_trace(go.Heatmap(
                     z=data['Z'],
                     x=data['X'],
                     y=data['Y'],
                     hovertemplate='Y: %{y}<br>'+'X: %{x}<br>'+'Counts: %{z}<br>',
                     colorscale="greens",
                     colorbar = dict(x=0.45),
                     visible=True,
                     ),
                     1,1)
fig.add_trace(go.Heatmap(
                     z=data['Z2'],
                     x=data['X2'],
                     y=data['Y2'],
                     hovertemplate='Y: %{y}<br>'+'X: %{x}<br>'+'Counts: %{z}<br>',
                     colorscale="blues",
                     visible=False,
                     ),
                     1,2)
fig.add_trace(go.Heatmap(
                     z=data['Z8'],
                     x=data['X8'],
                     y=data['Y8'],
                     hovertemplate='Y: %{y}<br>'+'X: %{x}<br>'+'Counts: %{z}<br>',
                     colorscale="oranges",
                     visible=False,
                     ),
                     1,2)

### Create buttons for drop down menu#Thanks to the work of https://stackoverflow.com/questions/50518090/python-plotly-multiple-dropdown-plots-each-of-which-have-subplots
buttons = []
for i, label in enumerate(labels):
    visibility = [i==j for j in range(len(labels))]
    button = dict(
                 label = label,
                 method = 'update',
                 args = [{'visible': visibility},
                     {'title': label}])
    buttons.append(button)

updatemenus = list([
    dict(active=-1,
         x=-0.15,
         buttons=buttons
    )
])

fig.update_xaxes(
                title_text="X-title",
                row=1, col=1
)

fig.update_xaxes(
                title_text="X-title",
                row=1, col=2
)

fig.update_yaxes(
                title_text="Y-title",
                row=1, col=1
)

fig.update_yaxes(
                title_text="Y-title",
                row=1, col=2
)

fig['layout']['title'] = 'Title'
fig['layout']['showlegend'] = False
fig['layout']['updatemenus'] = updatemenus

fig.show()

with open('plot_heatmap.html', 'w') as f:
    f.write(fig.to_html(include_plotlyjs='cdn'))

sys.exit()

```

Any help would be appreciated.

Thanks in advance.