svg.intersections.js

Intersections plugin for svg.js

Finds intersections of paths and lines.

Demo.

Installation

npm i -S svg.intersections.js

For non- AMD or CommonJS adds a global SVGIntersections.

Usage

``javascript
var draw = SVG('drawing').size(400, 400),
line = draw.line(19, 127, 252, 386).stroke('blueviolet'),
path = draw.path('M140 45 L 12 250').stroke('darkorange'),
intersectionPoints;
`
Then

`javascript
intersectionPoints = path.intersectsLine(line);
`
Or

`javascript
intersectionPoints = line.intersectsPath(path);
`

Result

`javascript
[
{
x: 62.453914292554465,
y: 175.3028489346421
}
]
`

When checking with a path, first it splits it into line segments and checks a line-line intersection.

segmentLength specifies the length of a segment.

Longer segment -> faster and less accurate

Be carefull checking intersections of two paths (especially long), with a hight accuracy - it can be really slow.

$3

#### SVG.Path

.intersectsLine(line [, segmentLength])

.intersectsPath(path [, segmentLength])

#### SVG.Line

.intersectsLine(line)

.intersectsPath(path [, segmentLength])`

API

SVGIntersections

* SVGIntersections
* [~path_linePos(pathEl, linePos, [segmentLength])](#module_SVGIntersections..path_linePos) ⇒ Array.<Point>
* ~linePos_linePos(line1Pos, line2Pos) ⇒ Point | undefined
* ~fromLineToLinePos(line) ⇒ Object
* ~lengthBetweenTwoPoints(x1, y1, x2, y2) ⇒ number
* ~isPointOnLine(x1, y1, x2, y2, x, y) ⇒ Point | undefined
* ~Position : Object
* ~Point : Object

$3

Get intersection points for a path element and a line position.
Devides a path into line segments and finds line-to-line intersection.

Kind: inner method of SVGIntersections
Returns: Array.<Point> - - Array of intersection points

| Param | Type | Default | Description |
| --- | --- | --- | --- |
| pathEl | Object | | SVG.Path element |
| linePos | Position | | Line start&end position |
| [segmentLength] | Number | 10 | Path segment length. Used for accuracy |

$3

Get intersection point for 2 lines depending on their start&end position points.
Original function

Kind: inner method of SVGIntersections
Returns: Point | undefined - - Intersection point or undefined

| Param | Type | Description |
| --- | --- | --- |
| line1Pos | Position | First line start&end position |
| line2Pos | Position | Second line start&end position |

$3

Get start&end points from a line

Kind: inner method of SVGIntersections
Returns: Object - - Start&end points

| Param | Type | Description |
| --- | --- | --- |
| line | Object | SVG.Line element |

$3

Find length between two points

Kind: inner method of SVGIntersections
Returns: number - - Length between start&end position

| Param | Type | Description |
| --- | --- | --- |
| x1 | number | Start point x |
| y1 | number | Start point y |
| x2 | number | End point x |
| y2 | number | End point y |

$3

Check if point is on line

Kind: inner method of SVGIntersections
Returns: Point | undefined - - Check point or undefined

| Param | Type | Description |
| --- | --- | --- |
| x1 | number | Start point x |
| y1 | number | Start point y |
| x2 | number | End point x |
| y2 | number | End point y |
| x | number | Check point x |
| y | number | Check point y |

$3

Kind: inner typedef of SVGIntersections
Properties

| Name | Type | Description |
| --- | --- | --- |
| x1 | number | Start point x |
| y1 | number | Start point y |
| x2 | number | End point x |
| y2 | number | End point y |

$3

Kind: inner typedef of SVGIntersections
Properties

| Name | Type |
| --- | --- |
| x | number |
| y | number |

License

MIT