vue-annotator
vue-annotator copied to clipboard
DrSensor
Vue Component for drawing annotation (rect, polygon, etc) using SVG element
Add `autofit` props to make the canvas fill width and height. #### Usage ```html ``` #### Clue Set width and height of `$refs.bg` equal to `scroll{Width/Height}` of `$refs.svg.parentNode`
## Slots | Method name | Description | Accepted Element | |---------- |-------- |---------- | | `select` | *texture element to apply when annotation is selected | `` | ##...
Emit `intersect` event every time shape intersect with each others. Each intersect will emit data array of SVG.Element - `@intersect.start` when shape begin to intersect - `@intersect.end` when shape leave...
Make this events able `v-bind` by invoking `.sync` - [ ] `:select.sync="element"` - [ ] `:unselect.sync="element"` - [ ] `:delete.sync="element"` - [ ] `:add.sync="element"` > Tips: use `watch: { :...
Add ability to zoom in/out when: - [ ] `Ctrl` + Mouse Wheel - [ ] __Pinch to Zoom__ based on http://interactjs.io/ example This [snippet](https://github.com/DrSensor/F.I.D.E/blob/68c952698cd77f3b0450270ae1b24b08754aed58/src/renderer/components/Annotator.vue#L58) may become handy. Change `$slots.default`...
Enter __rotate and scale on drag__ mode when double click. - [ ] Use [dblclick](https://developer.mozilla.org/en-US/docs/Web/Events/dblclick) event listener on `this.$slots.default` - [ ] [Bonus] add [Multi-touch Rotation](http://interactjs.io) > Reference: https://codepen.io/drsensor/pen/Vyjaao ------...