Introduction
ImageAnnotationPreview
is a widget for displaying image annotation.
Function signature
image_preview = ImageAnnotationPreview(
annotations_opacity = 0.5,
enable_zoom = False,
line_width = 1,
)
Parameters
annotations_opacity
Annotation opacity. Value must be between 0 and 1. Set to 0 to hide annotations.
type: float
default value: 0.5
image_preview = ImageAnnotationPreview(
annotations_opacity = 1,
)
enable_zoom
If True
, allows to zoom image with the mouse wheel.
type: bool
default value: False
image_preview = ImageAnnotationPreview(
enable_zoom = True,
)
line_width
Width of the annotation border (contour) line. Set to 0 to hide line.
type: int
default value: 1
image_preview = ImageAnnotationPreview(
line_width = 0,
)
widget_id
ID of the widget.
type: str
default value: None
Methods and attributes
Mini App Example
You can find this example in our Github repository:
supervisely-ecosystem/ui-widgets-demos/media/015_image_annotation_preview/src/main.py
Import libraries
import os
from random import choice
import supervisely as sly
from dotenv import load_dotenv
from supervisely.app.widgets import Button, Card, Container, ImageAnnotationPreview
Init API client
First, we load environment variables with credentials and init API for communicating with Supervisely Instance:
load_dotenv("local.env")
load_dotenv(os.path.expanduser("~/supervisely.env"))
api = sly.Api()
Initialize Project ID
project_id = sly.env.project_id()
Get Project ID and meta
project_id = sly.env.project_id()
project_meta_json = api.project.get_meta(project_id)
project_meta = sly.ProjectMeta.from_json(project_meta_json)
Get images from dataset
dataset = api.dataset.get_list(project_id)[0]
images = api.image.get_list(dataset.id)
image = images[0]
Get annotation for image
ann_json = api.annotation.download(image.id).annotation
ann = sly.Annotation.from_json(ann_json, project_meta)
Initialize ImageAnnotationPreview widget and set image with annotation and project meta
image_preview = ImageAnnotationPreview(
annotations_opacity=0.5,
enable_zoom=False,
line_width=1,
)
image_preview.set(
image_url=image.preview_url,
ann=ann,
project_meta=project_meta
)
Add button widget to show random image, we will use it later
random_button = Button("Random image")
Create app layout
Prepare a layout for app using Card
widget with the content
parameter and place widgets that we've just created in the Container
widget.
card = Card(
title="ImageAnnotationPreview",
content=Container([image_preview, random_button])
)
Create app using layout
Create an app object with layout parameter.
app = sly.Application(layout=layout)
Add button click event to update preview
@random_button.click
def set_random_image():
random_image = choice(images)
random_ann_json = api.annotation.download(random_image.id).annotation
random_ann = sly.Annotation.from_json(
random_ann_json,
project_meta
)
image_preview.set(
image_url=random_image.preview_url,
ann=random_ann,
project_meta=project_meta
)