How can I remove plotly select box after the selection is done

After doing plotly_select I want to remove the select box. How can I achieve that.

Hello,

if you do a plotly_select the plot shows only the points inside the select box. This state is over after you do e.g. a double click.
What is your desired behaviour? Should the select box be hiddenn (or removed) BUT the point selection still live?

This example do this: https://jsfiddle.net/tkwqnkax/

My desired behaviour is if I have selected
var layout = {
‘dragmode’ : ‘select or lasso’
}
After selection I want the select box should go. The suggestion that you have given is applicable only for zoom mode.

Sorry, I don’t understand you. My code have nothing to do with zoomMode I think.
My example shows the following: If you activate the “Lasso Select” or OR “Box Select” and use it to select some points in the plot, the dashed line will be removed after the user did the selecion.

My english is not very good and I think I don’t understand you. Do you want to delete the Lasso-Select-Button and the Box-Select-Button from the modebar above the plot?

My example shows the following: If you activate the “Lasso Select” or OR “Box Select” and use it to select some points in the plot, the dashed line will be removed after the user did the selecion.

When I am implementing the same as you have mentioned in your example. My dashed line is not getting removed after the user is done with the selection part.

Do you run it directly in jsfiddle? The dashed line will removed after selection… Or do you mean the button (“Select Box”) above the plot?

The dashed line should be removed after selection mean Select box.

Sorry, I don’t get it.

Can you explain it with simplier words? Tell me the exactly desired behaviour e.g. so:
->I click the “Select Box”-Button above the Plot
->I draw a Rectangle into the plot: A dashed rectancle appears in the plot
->Desired Behaviour: After this, the dashed rectangle should be removed

Yes, exactly you got it right. How can I do that

Hmm… But my jsFiddle-Example should exactly do that:
https://jsfiddle.net/tkwqnkax/

Do the following one the graph, that plottet there bottom-right:
->Move your cursor to the plot and click on the “Box Select”-Button above the plot
->Now you are able to draw a rectangle to the plot. Do that…
->The dashed rectancle stretches shortly until you release the mouse-left-click and then the dashed rectangle disappears/removed.

Or not?:smiley:

Yups, sorry for the trouble. The I was implementing was wrong. Thank you

For the record, the linked code indeed removes the selection box - which was the direct question - but doesn’t undo the styling of the points (graying out) that fall outside the selection. So it doesn’t restore the original state. Double-clicking on the chart (even programmatically) achieves that and the box removal too.

Can you share a code example of how to remove box selection with double click?

See this discussion: Unselect points when click empty area - #3 by maab