Skip to content
/ lines Public

Similar to jsplumb except lines.js uses a <SVG> -1 zIndex layer to draw it's lines.

Notifications You must be signed in to change notification settings

inkwhy/lines

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

17 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

lines

alt text

Hey...

This can be used to point out things in a fancy user interface!
That's what we use it for.

alt text


lines is derived from raphael.js' graffle.js. What lines does is set the style of the element with the ID of "lines" to be absolutely positioned and with a z-index of -1, creating a raphael generated svg layer behind your front-end layout. In that svg layer, a line is drawn between two selected element. It works by calling the lines function. The following is a example:

in your html

<div id="lines"> </div>

in your javascript

var boxOne = Y.one('#box1');
var boxTwo = Y.one('#box2');

lines(boxOne, boxTwo);

Dependencies
Raphael.js 1.4.7
YUI 3.x

TO DO

  1. Fix any issues.
  2. Create a branch for the jQuery masses.
  3. Add more arugments to the lines function to allow specification of which side the line connects to.
  4. Online example with dragging and spawning lined elements.
  5. Create node.js module branch with YUI.node and/or jQuery.node.
  6. Determine if using raphael.js is nessesary for lines and if not, replace it with pure svg.
  7. Further field testing & feedback.
Thank You for checking lines out.

About

Similar to jsplumb except lines.js uses a <SVG> -1 zIndex layer to draw it's lines.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published