Simple tool to transform svg
files and Strings into Object
or JSON
.
Useful to manipulate SVG
with js
, to store in noSQL databses.
v2
docs
Install
yarn add svgson
Usage
const { parse, stringify } = require('svgson')
parse(`
<svg>
<line
stroke= "#bada55"
stroke-width= "2"
stroke-linecap= "round"
x1= "70"
y1= "80"
x2= "250"
y2= "150">
</line>
</svg>`).then((json) => {
console.log(JSON.stringify(json, null, 2))
const mysvg = stringify(json)
})
umd
usage
const svgson = require('svgson')
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)
)
mysvg = svgson.stringify(json)
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.camelcase
Apply camelCase
into attributes
Type: Boolean
Default: false
svgson.parseSync
Added in 3.1.0
svgson.parseSync(input[, options])
This function is a synchronous version of svgson.parse
. The arguments are the same, but unlike svgson.parse
, the return value is not wrapped in a Promise
.
Returns: Object
[Object]
svgson.stringify
svg = svgson.stringify(ast[, options])
Returns: String
-
ast
svgson
parsed result.
Type: Object
[Object]
-
options.transformAttr
Function to apply on each attribute when stringifying.
Type: Function
that returns the key/attribute string with the ability to use the escape function on it.
Default:
function(key, value, escape) {
return `${key}="${escape(value)}"`
}
Function to apply on each node when stringifying, useful when need to reshape nodes or change/update values.
Type: Function
that returns the node
Default:
function(node){
return node
}
-
options.selfClose
Type: Boolean
Default: true
-
Pretty Printing
In order to generate pretty formatted SVG output, use pretty
npm module:
pretty = require('pretty')
formatted = pretty(svg)
Related
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)
License
MIT © Lionel T