How to add a shape when user adds an annotation shape

Hi everyone. Regarding image annotations using Plotly Dash, I’ve done the tutorials found here:

My question is this, suppose I draw a square shape - how do I automatically draw a circle shape using the mouse information provided by the square shape?

Can someone please point to a location where I can learn to do this?

I’ve been able to do all the examples found in “Image Annotations” section, but I haven’t been able to figure out the code, and callback to automatically add an annotation based on user input.

Any help in doing this would be greatly appreciated!


Hi @iacisme ,

you could trigger the click event and create the circular shape directly like this:

You could also extract the shape(s)information from the figure and extract the coordinates of the shape and use the dimensions to create your circular shape.

def get_current_shape(figure):
    # extract shape information from figure
    shapes = figure['layout'].get('shapes', [])
    return shapes

def extract_shape_info(shape):
    color = shape.get('line', {}).get('color', {})
    dimensions = [shape.get(coordinate, {}) for coordinate in ['x0', 'y0', 'x1', 'y1']]
    return color, dimensions

Thank you!

Your example is really helping me figure this out.