TL;DR
How to get selected data in plotly.graph_objects a subplot of different graph types?
I have a different type of data for the same entities,
for example, for a group of persons, I have height, weight, age…
I want to plot for each data type 3 plots, scatter, bars (by splitting to ranges), and a table with a summary (triplet).
And I want to be able to plot for more than one triplet at the same time.
I need to be able to be responsive with the data selection, selecting a group of persons in the height to scatter or bar should
have an effect on the other graphs, similar to Part 4. Interactive Graphing and Crossfiltering | Dash for Python Documentation | Plotly in Generic Crossfilter Recipe
since you can’t plot different types in a subplot using plotly.express I have decided to work with plotly.graph_objects
but I can’t get any information on the callback, I tried selectedData, clickData and figure properties but I can’t seem to get the data I want in the callback
what am I doing wrong?
Here is the smallest code I could write to reproduce my problem:
import dash_html_components as HTML
from dash.dependencies import Input, Output
import dash_core_components as dcc
from plotly.subplots import make_subplots
from dash.dash import no_update
import plotly.graph_objects as go
import numpy as np
import pandas as pd
import dash
def build_single_plot(data_list):
ys_data, xs_data, values_count, ranges_labels, table_data_lst = [], [], [], [], []
for data in data_list:
y_data = np.sort(data)
x_data = [i for i in range(1, len(y_data) + 1)]
range_bins = pd.cut(np.array(np.array(y_data).astype(float)), 10)
ranges_label = [str(v) for v in set(range_bins)]
value_count = list(range_bins.value_counts())
type, res = ['Max', 'Min', 'Median'], [max(data), min(data), np.median(data)]
ys_data.append(y_data), xs_data.append(x_data), values_count.append(value_count), ranges_labels.append(ranges_label), table_data_lst.append([type, res])
n_cols = 2
n = len(data_list)
n_rows = int((n / 2) + 1 * (n % 2))
row_spec = [[{"type": "xy"}, {"type": "xy"}], [{"type": "xy"}, {"type": "xy"}], [{"type": "table"}, {"type": "table"}]]
specs = row_spec * n_rows
fig = make_subplots(rows=n_rows * 3, cols=n_cols, specs=specs, )
for col in range(1, n_cols + 1):
for row in range(1, n_rows * 3 + 1, 3):
fig.add_trace(go.Scatter(x=xs_data[0], y=ys_data[0], mode="markers", ), row=row, col=col)
fig.add_trace(go.Bar(y=values_count[0], x=ranges_labels[0]), row=row + 1, col=col)
fig.add_trace(go.Table(header=dict(values=['Type', 'Data']), cells=dict(values=table_data_lst[0])), row=row + 2, col=col)
return fig
data_list_to_plot = np.random.rand(5, 300)
fig = build_single_plot(data_list_to_plot)
app = dash.Dash(__name__)
app.layout = html.Div([
html.Div(id='container-button-timestamp'),
dcc.Graph(id='sample-graph', figure=fig, style={'height': '800px'} )
])
@app.callback(Output('sample-graph', 'figure'),
[Input('sample-graph', 'selectedData')])
def on_selected_data(selected_data):
print("How can I get here?")
return no_update
if __name__ == '__main__':
app.run_server(debug=True, port=8050)