# points-on-path

> Estimate points on a SVG path

Latest version **0.2.1** (published 2020-05-01) · MIT license · 0 weekly downloads

## Install

```sh
npm install points-on-path
pnpm add points-on-path
yarn add points-on-path
bun add points-on-path
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.1 |
| Published | 2020-05-01 |
| First published | 2020-04-11 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 9.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 42 |
| Author | Preet Shihn |
| Maintainers | shihn |
| Keywords | SVG, graphics |

## Links

- npm: https://www.npmjs.com/package/points-on-path
- Repository: https://github.com/pshihn/points-on-path
- Homepage: https://github.com/pshihn/points-on-path#readme
- Issues: https://github.com/pshihn/points-on-path/issues
- npm.io page: https://npm.io/package/points-on-path

## Dependencies (2)

- [points-on-curve](https://npm.io/package/points-on-curve.md) 0.2.0
- [path-data-parser](https://npm.io/package/path-data-parser.md) 0.1.0

## Alternatives

- [d3-force-3d](https://npm.io/package/d3-force-3d.md) — 1.0M weekly downloads
- [ng2-charts](https://npm.io/package/ng2-charts.md) — 486.8K weekly downloads
- [@arcgis/core](https://npm.io/package/@arcgis/core.md) — 257.8K weekly downloads
- [react-sparklines](https://npm.io/package/react-sparklines.md) — 249.3K weekly downloads
- [react-native-gifted-charts](https://npm.io/package/react-native-gifted-charts.md) — 182.3K weekly downloads

## Recent versions

- 0.2.1 (latest) — 2020-05-01
- 0.2.0 — 2020-04-14
- 0.1.1 — 2020-04-13
- 0.1.0 — 2020-04-11
- 0.0.1 — 2020-04-11

## README

# points-on-path

This package calculate the points on a SVG Path with a certain tolerance. It can also simplify the shape to use fewer points. 
This can really usefule when estimating lines/polygons for paths in WebGL or for Hit/Cosllision detections. 

This package essentially combines packages [path-data-parser](https://github.com/pshihn/path-data-parser) and [points-on-curve](https://github.com/pshihn/bezier-points)

## Install

From npm

```
npm install --save points-on-path
```

The package is distributed as an ES6 module. 

## Usage

### pointsOnPath(path: string, tolerance?: number, distance?: number): PathPoints

Pass in a SVG path string and get back a `PathPoints` object. A `PathPoints` gives you a list of points (each being a an array of 2 numbers `[x, y]`), and a flag telling you if the path is actually composed of multiple disconnected paths. 

```javascript
PathPoints {
  points: Point[];
  continuous: boolean;
}
```

Take this path for example:

![points on path](https://user-images.githubusercontent.com/833927/79054782-ba8d0300-7bfc-11ea-8f16-ed36001c56c9.png)

and estimate the points on the path

```javascript
import { pointsOnPath } from 'points-on-path';

const points = pointsOnPath('M240,100c50,0,0,125,50,100s0,-125,50,-150s175,50,50,100s-175,50,-300,0s0,-125,50,-100s0,125,50,150s0,-100,50,-100');
// plotPoints(points);
```

![points on path](https://user-images.githubusercontent.com/833927/79054650-8d8c2080-7bfb-11ea-93cf-2c070dfe63c5.png)

The method also accepts two optional values `tolerance` and `distance`. These are described by [points-on-curve](https://github.com/pshihn/bezier-points); to estimate more tolerant and fewer points. 


![points on path](https://user-images.githubusercontent.com/833927/79054652-8e24b700-7bfb-11ea-8ff8-68dce51a3940.png)

![points on path](https://user-images.githubusercontent.com/833927/79054653-8ebd4d80-7bfb-11ea-8645-a5a0ed81cf84.png)

## License
[MIT License](https://github.com/pshihn/points-on-path/blob/master/LICENSE)

---
_Source: https://npm.io/package/points-on-path · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._