TODAY learn how to bring Drag & Drop to Dash with Dashboard Engine. 🌠 Sign up for the live event!

How to reduce the minimum constant drag distance of 8px (minDrag) in editable shapes

In my Dash api I automatically generate plots with shapes like rectangles, lines and paths. And I need the user to readjust the shapes if necessary, so there is an edit button that makes them editable. My problem is that the minimum 8px drag distance defined in the MINDRAG constant does not allow the user to adjust the shape near the original node because it skips the minimum distance. Therefore, I would need to disable this function to check if the drag distance is less than MINDRAG, or to be able to reduce that distance to 1px, because 8px is too much distance to get a correct adjustment.

Attached GIF of example of the jump of the minimum distance.

Hnet-image

I have copied in the assets folder a bundle of plotly.js with the constant MINDRAG modified from 8px to 1px and it works. Only if I need to update plotly I will have to re-download and modify the constant