-
Notifications
You must be signed in to change notification settings - Fork 465
Image Annotator
Tools are built with Vue components that use the tool.js mixin to inherit functions and properties. The mixins act as a parent class and bring structure to the design of tools in the annotator. Each tool initializes a Paper Tool, which is then configured to call specific functions within the component on common events which are overwritten by the child class. The mixin also sets the tools icon, appropriate colors and manages the tools state.
Select Tool is the default tool for the annotator and provides many useful features for inspecting metadata and modifying annotations directly on the canvas. Users can carry out any of the following operations to modify annotations:
- click and drag points to move them to there desired location
- hold the
shiftkey well click d to remove points - click any point online the stroke of the shape to add any additional points.
A white circle is created as visual feedback when a point is selected.
| Option | Type | Description |
|---|---|---|
| Show hover Text | Toggle | Show metadata when hovering over annotations (disabling can increase performance) |
The Polygon Tool creates polygonal shapes and paths (shape outlines). To complete a section place a point close to the start of your selection or click 'Close Polygon' found in the options panel. Once closed a simplification is applied to remove any excessive points and saved to the currently selected object layer.
Useful for creating accurate annotations, or annotation objects without distinct edges.
| Option | Type | Description |
|---|---|---|
| Guidance | Toggle | Draws a line between the cursor and last added point |
| Delete Polygon | Operation | Removes currently selected polygon |
| Complete Distance | Integer | Distance between first and last point to trigger automatic completion |
This tool can only be activated when an annotation layer is selected, otherwise, the tool is disabled.
Flood fill, also commonly called Magic Wand, is the algorithm used in to create selections using by determining the area connected to a given pixel and expanding outward until pixels no-longer are similar. It is useful for extracting objects from a flat background, quickly selecting an irregularly shaped area, or selecting a distinctly-colored element. This tool is implemented by using the library created by Paul Tamersoul called magic-wand-js.
When a user clicks a pixels on the image, a selection is made using the floodFill function which creates a binary mask. The gaussian-blur function, (gaussBlurOnlyBorder), is then applied to the binary mask to smooth out any inconsistencies. The final step converts the mask into a contour array (traceContours) which is passed to a Paper JS object to create a visual selection.
| Option | Type | Description |
|---|---|---|
| Threshold | Number | Pixel similarity threshold |
| Blur | Number | Amount to blur outline for smoother outlines |
This tool can only be activated when an annotation layer is selected, otherwise, the tool is disabled.
The brush tool allows users to select a circle shape as well as thickness in pixels and move the cursor over the desired shape create an annotation.
Deep Exemtrem
The Annotate Tool was created to allow for circular annotations. This means, as you create training data and train a model you can call on it to annotate more images for you quicker.
By default this tool is disabled and required adding of API URL to the dataset. This will be the URL the annotate will post the image and apply any annotations returned to your current image. Inside the annotator click the settings icon on the left panel. Type the URL of the model (if using the built in MaskRCNN its /api/model/maskrcnn)
Pre-configued support for MaskRCNN comes right in the annotator. Take a look at issue #176 for more information.