elrumordelaluz / 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