Skip to content
Transform SVG elements into path
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
src Rollup 🎉 Jun 5, 2018
.gitignore
README.md
logo.svg Add tests, logo, typos May 29, 2018
package.json
path.js
rollup.config.js Update rollup. Fix options renamed Jul 19, 2018
scale.js
test.js
yarn.lock

README.md

Element to Path

Sometimes is useful to have an svg done with paths instead of elements
such as rect, circle, ellipse, line, polyline or polygon.
Like when you apply Compound Path in Adobe Illustrator.

Install

yarn add element-to-path

Usage

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 based:

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

options

Type: Object

nodeName

Type: string
Default: name

Use custom name key in elem input

nodeAttrs

Type: string
Default: attributes

Use custom attributes key in elem input

Related

path-that-svg! Convert an entire SVG using paths

All calculations are based on W3C Spec

License

MIT © Lionel Tzatzkin

You can’t perform that action at this time.