Hello everyone,
I am trying to set up an app where I display a heatmap and besides it I display in an inline-block tabs where processing of this heatmap happends. so far I haven’t manage to make it work. Here is the code I am using and the result I get
html.Div([
html.Div([
dcc.Graph(
id='raw_image',
hoverData={'points': [{'x': 0, 'y': 0}]},
clickData={'points': [{'x': 0, 'y': 0}]}
)
], style={'display': 'inline-block', 'width': '50%'}),
html.Div(
dcc.Tabs(
id="tabs",
value='spectral_analyser',
parent_className='custom-tabs',
className='custom-tabs-container',
children=[
dcc.Tab(
label='Spectral analyser',
value='spectral_analyser',
className='custom-tab',
selected_className='custom-tab--selected',
children=[
html.Div([
html.Div([
dcc.Graph(
id='raw_spectra'
),
], className='two_columns', style={'display': 'inline-block', 'width': '50%'}),
html.Div([
dcc.Graph(
id='raw_spectra_roi'
),
], className='two_columns', style={'display': 'inline-block', 'width': '50%'}),
])
]
),
dcc.Tab(
label='Physiological parameters retrieval',
value='parameter_retrieval',
className='custom-tab',
selected_className='custom-tab--selected',
children=[
html.Div([
html.Div([
dcc.Graph(
id='physiological_parameter',
clickData={'points': [{'x': 0, 'y': 0}]}
),
], className='two_columns', style={'display': 'inline-block', 'width': '30%'}),
html.Div([
dcc.Graph(
id='roi_mean',
),
], className='two_columns', style={'display': 'inline-block', 'width': '30%'}),
]),
]
)
]
)
)
])