# element-to-path

Latest version **1.2.1** (published 2021-08-19) · MIT license · 0 weekly downloads

## Install

```sh
npm install element-to-path
pnpm add element-to-path
yarn add element-to-path
bun add element-to-path
```

## Health

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

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.2.1 |
| Published | 2021-08-19 |
| First published | 2018-05-29 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 11 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 61 |
| Author | Lionel T |
| Maintainers | elrumordelaluz |
| Keywords | svg, path, paths, conversion |

## Links

- npm: https://www.npmjs.com/package/element-to-path
- Repository: https://github.com/elrumordelaluz/element-to-path
- Homepage: https://github.com/elrumordelaluz/element-to-path#readme
- Issues: https://github.com/elrumordelaluz/element-to-path/issues
- npm.io page: https://npm.io/package/element-to-path

## Alternatives

- [base64url](https://npm.io/package/base64url.md) — 6.1M weekly downloads
- [get-installed-path](https://npm.io/package/get-installed-path.md) — 502.9K weekly downloads
- [@uppy/url](https://npm.io/package/@uppy/url.md) — 185.8K weekly downloads
- [@d3fc/d3fc-shape](https://npm.io/package/@d3fc/d3fc-shape.md) — 16.2K weekly downloads
- [localizer](https://npm.io/package/localizer.md) — 226 weekly downloads

## Recent versions

- 1.2.1 (latest) — 2021-08-19
- 1.2.0 — 2018-06-05
- 1.1.0 — 2018-05-31
- 1.0.0 — 2018-05-29

## README

<p align="center">
  <img alt="Element to Path" title="Element to Path" src="https://cdn.rawgit.com/elrumordelaluz/element-to-path/8f33cf5f/logo.svg" width="450">
</p>

<p align="center">
  Sometimes is useful to have an <code>svg</code> done with <code>path</code>s instead of elements <br />
  such as <code>rect</code>, <code>circle</code>, <code>ellipse</code>, <code>line</code>, <code>polyline</code> or <code>polygon</code>. <br/>
  Like when you apply <em>Compound Path</em> in <em>Adobe Illustrator</em>.
</p>

## Install

```zsh
yarn add element-to-path
```

## Usage

```js
const toPath = require('element-to-path')

const circle = {
  type: 'element',
  name: 'circle',
  attributes: {
    cx: 10,
    cy: 10,
    r: 5,
  },
}

const path = toPath(circle)
// 'M15 10 A5 5 0 0 1 10 15 A5 5 0 0 1 5 10 A5 5 0 0 1 15 10 z'
```

## API

### toPath(elem,[options])

#### elem

Type: `Object`
Element to convert. Default notation is [svgson](https://github.com/elrumordelaluz/svgson) based:

```js
{
  type: 'element', // could be ignored
  name: 'rect|circle|ellipse|line|polyline|polygon|path'
  attributes: {
    // depends on each element
  }
}
```

#### options

Type: `Object`

##### nodeName

Type: `string`<br>
Default: `name`

Use custom **name** key in `elem` input

##### nodeAttrs

Type: `string`<br>
Default: `attributes`

Use custom **attributes** key in `elem` input

## Related

[path-that-svg!](https://github.com/elrumordelaluz/path-that-svg) Convert an entire `SVG` using `path`s

All calculations are based on [W3C Spec](https://www.w3.org/TR/SVG2/shapes.html)

## License

MIT © [Lionel Tzatzkin](https://lionel.tzatzk.in)

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