Simple Vue Annotation for Vue3 Composition api

$3

!annotation

$3

- Draggable and Resizeable
- Customize Box style
- Get Box Info (position, width, height)

$3

``
npm i vue-annotation
`

$3

`javascript



``

- This library uses D3.js, so it draws boxes inside an SVG tag within a template tag. To do this, it is necessary to declare the svgRef from the useAnnotation composable as the ref of the SVG tag.

$3

| Props | Type | Default |
| ----------------- | ------ | ------- |
| boxStrokeWidth | number | 1 |
| boxStrokeColor | string | blue |
| boxFillColor | string | #FFCCCC |
| boxFillOpacity | number | 0.4 |
| circleRadius | number | 6 |
| circleFillColor | string | red |
| circleStrokeColor | string | black |