Is there a way to clear clickData?

When filtering a chart through clickData, it is not possible to clear the click and show the entire plot again after that. Has anyone figured out a way to do this? We have ‘clear_on_unhover = True’, but I don’t see a way to do the same when using clickData.

There isn’t yet. I’d like for this to be added as a “selection” mode in plotly.js. This issue is in https://github.com/plotly/plotly.js/issues/1852 . We’ll likely need a commercial sponsor to help pull this one through, so if your organization or company can help fund these feature, please reach out (https://plotly.typeform.com/to/rkO85m).

1 Like

This is a major gap in functionality. I get it, the software is free and I am super appreciative of the work that’s been done but this is the kind of thing that pushes tableau back into the conversation…

1 Like

It definitely was! That’s why we prioritized it :slight_smile: As you can see from the open source GitHub issue that I posted above (Persistent and Multiple Clicking and Unclicking Behaviour · Issue #1852 · plotly/plotly.js · GitHub) this was actually solved via the selectedpoints property through this monumental PR: 1852 persistent click via select points by rmoestl · Pull Request #2944 · plotly/plotly.js · GitHub. I don’t think any Dash-specific examples have made it through to the docs yet, but you may be able to figure it out via the plotly.js examples included in that PR.

Always appreciate the feedback!

That sounds promising. However, from what i can tell selectedpoints is not a property of graphs in Dash - there is selectedData which corresponds to box/lasso selections, which I guess is a workable alternative but the natural inclination is to click to select. I dunno, that also brings up why dont the selection tools allow u to click on a point. oh well.

1 Like

clickmode:“event+select” FTW!

1 Like

Exactly. The issue that I linked to (I recommend reading through all of the threads on GitHub) was to add click-to-select as part of the selected data, rather than just lasso.

1 Like

Is there still no way to clear selected data with a button?

It seems like double-click resets selection but is there a way to trigger it with a callback from button click?

1 Like

if it’s still actual, find this app Dash in dash app gallery.
There’s a code in Python to reset selection via button

i don’t know if is a good option, but i set the clickData as an Output and at the end i return as None

3 Likes

I don’t know if it’s a good option, but it works for me! I was using clickData to open a modal window to show more details about points on a graph in the main page…but because clickData persisted, if you clicked the same point more than once sequentially - it would not respond. Using clickData as an output clears it so that when the user closes the modal, if they choose to “reopen” the same data on the same point, it works! Thanks for the suggestion!

2 Likes

If anyone is still looking for a solution to this issue, I’ve found that using the “selectedData” instead of “clickData” property of the graph component has solved the issue.

You don’t have to set clickData as an output of the callback. Just click on the already selected mark and the selectedData dictionary will be reset back to None.

i tried this but doesn’t work for me

Just to be sure, is this the filtering behaviour you’re looking for?

selected data

Nope, is different, but i got None when i click on My graph for the property selectedData

It’s hard to tell without knowing your specific use case, but yes selecting the already selected mark will return None, so in my callback i add an IF statement that only modifies the dataframe if the selectedData property is NOT None.

 if selected_data is not None:
       category_selected = selected_data['points'][0]['x']
       filtered_df = df[df['category'] == category_selected]