Skip to content

Latest commit

 

History

History
43 lines (35 loc) · 1.19 KB

File metadata and controls

43 lines (35 loc) · 1.19 KB
title Boxes
summary Draw and style axis-aligned detection bounds.

Boxes

The box annotation renderer visualizes a detection's center-based rect geometry. Use BaseBoxStyle to control shape, corner radius, fill, stroke, visibility, and per-detection styling without changing the detection data.

<iframe data-supervision-playground-src="demo/?embed=annotation-renderer&renderer=boxes" loading="lazy" title="Interactive box visualization playground" ></iframe>

Add the box renderer

session.setPresentation({
  renderers: [
    annotationRenderers.box({
      style: new BaseBoxStyle({
        fill: { alpha: 0.12 },
        stroke: { width: 3 },
      }),
    }),
  ],
});

Rectangle x and y are the center in media pixels. Shape and opacity belong to the style; they should not be stored on the detection.

Omit annotationRenderers.box() from the authoritative renderer list to disable boxes while preserving every rectangle in the detection data.

See Presentation Styles for dynamic class colors and confidence predicates, or the BaseBoxStyle API reference for all options.