Idea: Arrows

[beeing]

Hi, thanks for this great library. I've been searching for hand drawn arrow for many years and this looks a great potential to do it.

Will be useful for libraries such as tourjs or introjs.

Thanks!

[pshihn]

I had thought of arrows. Never hashed out the details of it though .
From an API perspective should the arrow go from one element to another?
Describing all the properties of the arrow - shape, direction, thickness, length, etc

[beeing]

Hi @pshihn, the easiest is to go from one element to the other and then add thing incrementally.

Since your API is based on object, it is quite extensible. I would think the API would be something like:

annotate(e, {
  type: 'arrow',
  from: 'element'
});

that will draw a straight arrow, or with more options:

annotate(e, {
  type: 'arrow',
  from: 'element',
  bents: [['10%', +10, -20]],
  start: () => {},
  end: () => {}
});

Just a sketchy idea. Thanks.

[Leecason]

RoughAnnotationConfig should be the common properties, and those arrow only properties maybe should be wrapped in arrowOptions ?

[pshihn]

There are a lot of things to consider if arrow is "bound" to 2 elements. As the elements move around or change in size due to layout, updating the arrow could be tricky.

A simpler first step would be to just annotate arrows bound an element. Specify direction and length.

It would be nice to document some discrete examples or use cases for this.

[feliperaul]

Just wanted to say how awesome this would be.

[Bevebage]

+1

[lucasverra]

i like this!