dom-arrow

dom-arrow is a web component wrapper around the leader-line npm package.

Usage no npm install needed!

<script type="module">
  import domArrow from 'https://cdn.skypack.dev/dom-arrow';
</script>

README

Published on webcomponents.org

dom-arrow

dom-arrow is a web component wrapper around the leader-line npm package.

The name / idea of this web component was inspired by this library which helpfully links to a rather powerful library called leader-line.

Sample syntax

<div id=start>Hello</div>
<p>
    Euclid [described](https://en.wikipedia.org/wiki/Line_(geometry)) a line as "breathless length" which "lies equally with respect to the points on itself"; 
    he introduced several postulates as basic unprovable properties from which he constructed all of geometry, 
    which is now called Euclidean geometry to avoid confusion with other geometries which 
    have been introduced since the end of the 19th century (such as non-Euclidean, projective and affine geometry).
</p>
<div id=end>Goodbye</div>

<dom-arrow connect=#start to=#end color=green></dom-arrow>

Demo

Codepen demo

Running locally

  1. Do a git clone or a git fork of repository https://github.com/bahrus/dom-arrow
  2. Install node.js
  3. Run "npm install" from location of folder created in step 1.
  4. Run npm run serve. Open browser to http://localhost:3030/demo/dev.html