element-to-path

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

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
element-to-path
4551.2.12 years ago5 years agoMinified + gzip package size for element-to-path in KB

Readme

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