Skip to main content
The AnnotatedImage component displays a base image with colored annotations overlaid, useful for object detection and segmentation visualizations.

Basic usage

Constructor

tuple[Image, list[tuple[Mask, str]]] | None
default:"None"
Tuple of (base_image, annotations) where:
  • base_image is filepath, PIL Image, or numpy array
  • Each annotation is (mask, label) tuple
  • mask can be:
    • Tuple of 4 ints (x1, y1, x2, y2) for bounding box
    • Numpy array for segmentation mask (0-1 confidence values)
str
default:"'webp'"
Image format for saving (e.g., “png”, “jpg”)
bool
default:"True"
Whether to display legend of annotations
int | str | None
default:"None"
Component height
int | str | None
default:"None"
Component width
dict[str, str] | None
default:"None"
Dictionary mapping labels to hex colors (e.g., {"cat": "#FF0000"})

Events

  • select - Triggered when annotation is selected

Examples

Object detection

Segmentation masks