Svgson-next NPM

Install

yarn add svgson-next

Usage

const svgson = require('svgson-next')

// ----------------------------
// Convert SVG to JSON AST
// ----------------------------
svgson.parse(`<svg>
  <line
    stroke= "#bada55"
    stroke-width= "2"
    stroke-linecap= "round"
    x1= "70"
    y1= "80"
    x2= "250"
    y2= "150">
  </line>
</svg>`).then(function(json){
  console.log(JSON.stringify(json, null, 2));
  /*
    {
      name: 'svg',
      type: 'element',
      value: '',
      attributes: {},
      children: [
        {
          name: 'line',
          type: 'element',
          value: '',
          attributes: {
            stroke: '#bada55',
            'stroke-width': '2',
            'stroke-linecap': 'round',
            x1: '70',
            y1: '80',
            x2: '250',
            y2: '150'
          },
          children: []
        }
      ]
    }
  */
  
  // -------------------------------
  // Convert JSON AST back to SVG
  // -------------------------------
  mysvg = svgson.stringify(json)
  /* returns the SVG as string */
})

Test in browser here

API

svgson.parse

svgson.parse(input[, options])

Returns: Promise

input
Type: String
options.transformNode
Function to apply on each node when parsing, useful when need to reshape nodes or set default attributes.
Type: Function that returns the node
Default:
```
function(node){
  return node
}
```
options.compat
Use keys from previuos version of svgson
Type: Boolean
Default: false
options.camelcase
Apply camelCase into attributes
Type: Boolean
Default: false

svgson.stringify

svg = svgson.stringify(json)

Pretty Printing
In order to generate pretty formatted SVG output, use pretty npm module:
```
pretty = require('pretty')
formatted = pretty(svg)
```

svgson-cli Transform SVG into Object from the Command Line

element-to-path Convert SVG element into path

path-that-svg Convert entire SVG with path

svg-path-tools Tools to manipulate SVG path (d)