Bring Drag & Drop to Dash with Dashboard Engine. 💫 Learn how at our next webinar!

How to access and modify the rectangles added in drgamode="drawrect"?

I’m working with a scatter plot, which I’m running in dragmode “drawrect”. My scatter plot shows points in a regular grid, as shown below. I would like to draw rectangles interactively such that they coincide with the grid coordinates.

Is there a way to achieve this? Currently, the shapes inserted are not aligned with the grid. Is is somehow possible to intercept the call to “add_shape()” through a callback such that the coordinates can be corrected? Or is there a dragmode-setting that permits to snap to the closest points, with a similar logic as with hovermode=“closest”.

Thanks for any hint!

fig = px.scatter(x=x, y=y, symbol=symbols, symbol_map=symbol_map)
fig.update_layout(
    dragmode="drawrect")
fig.layout.hovermode = "closest"
fig.show(config={'modeBarButtonsToAdd':['drawrect',
                                        'eraseshape'
                                       ]})