jQuery DOM Line
Draw a line between any two arbitrary points, using a simple DOM element.
Full documentation and examples available at http://gilmoreorless.github.io/jquery-dom-line/
- jQuery version 1.4.3 or higher
- Louis-Remi Babé's jQuery transform CSS hook - included by default in the minified version of this plugin
$.line(fromPoint, toPoint[, options]);
toPoint are required objects with
y numeric properties, relative to the top left of the page.
options is an optional object, as listed below.
Return value is a jQuery object containing the element used for the line.
options object passed to
$.line is an object with the following available properties:
elem- jQuery selector of the element to use for the line, useful for re-using a single element for subsequent lines (default: empty - creates a new div)
className- CSS class added to the line div element (default: "jquery-line") - not used if
elemoption is provided
lineWidth- Thickness of the line in pixels (default: 1)
lineColor- CSS color of the line (default: black)
returnValues- If true, returns an object with the calculated dimensions for the line (see below), instead of a jQuery object (default: false)
returnValues option is set to true, a plain object is returned with the following defined properties:
fromPointargument passed to the function
toPointargument passed to the function
center- The centre point of the line (and also the point of rotation) - contains
rotation- The amount of rotation applied to the line - contains
- Add option to calculate CSS props without creating the line elem - can be used for animation positions