Sometimes is useful to have an svg
done with path
s 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 path
s
All calculations are based on W3C Spec
MIT © Lionel Tzatzkin