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.

yarn add element-to-path

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'

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
  }
}

Type: Object

Type: string
Default: name

Use custom name key in elem input

Type: string
Default: attributes

Use custom attributes key in elem input

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

All calculations are based on W3C Spec

MIT © Lionel Tzatzkin