svg-arrow

SVG Arrow

Interactive svg arrow. React component.

OnLine Example: http://frontend.workshop.red/svg-arrow

Install:

npm i svg-arrow

Use:

render() {
  return (
    <svg width={500} height={500}>
      <SvgArrow from={[50, 50]} to={[100, 100]} />
    </svg>
  );
}

Props:

from: from position;

to: to position;

onChange: callback when dragging;

color: triangle color, default '#ff0000';

stroke: stroke color, default '#000';

strokeWidth: stroke width, default 1;

fromDraggable: from position draggable, default true;

toDraggable: to position draggable, default true;