DASH chart - display underlying data by selecting element of chart

Dash Python
1

Before I dive into dash I would like to understand if its possible in DASH to select (control + click on element) an element of a pie chart or histogram and then display the underlying data in a pop up modal data table. I have seen this done with high charts and js however I want accomplish the same thing with Python and dash.

thanks in advance.

2

I would be happy with:

A. Yes it is possible
B. no it isn’t possible

3

Well, your initial question is easy to answer.

A. Yes it is possible

I guess that real question is how much effort it would take. Which in turn depends on what kind of data we are talking about and how it should be displayed.

4

For example if I had a list of everyone that was resident in Australia and that list included the following fields:
Location by state, age, male/female, firstname, lastname.

Using that data create a pie chart that can be drilled down through the following levels:
percentage by state, age and finally male/female.

When using the first level of percentage by state you control clicked on a segment of the pie chart and it then showed a modal table that is a filtered list/table by the selected location for all the remaining information. The table would be searchable. When you close the table you go back to the first level of the pie chart, Same same for the second level which would be a state with segments for male and female. Control click on one of the two segments and it brings up the underlying data.

I hope that is clear enough and thank you for responding.

5

You will need to write several callbacks, but this is definitely possible with the hoverData , clickData or selectedData properties. Here is the relevant documentation.

To give you a concrete example, I am making a dashboard where the user may click on a choropleth map to show additional graphs for one or more specific regions.

6

Thank you, excellent answer. :slight_smile:

7

Have gone away and put together my plot (piechart) and I’m able to gather the hover data and click data however I’m unable to figure out how I can open a modal window by clicking a section of the piechart without using the n_clicks method which dcc.graphs does not have. Plenty of examples using a button and the n_clicks method but nothing using a click event on a section of a graph.

Any ideas?

8

So more reading and playing and I ended up using:

ctx = dash.callback_context
ctx_msg = json.dumps(ctx.triggered)

if json.loads(ctx_msg)[0][‘prop_id’] == ‘the_graph.clickData’:

to identify when the graph had been clicked on as opposed to another trigger.

Is there a simpler way of doing this?