bf-svg-path-parse

This is a small library to normalise SVG paths based on those normalised paths.

Note: this package works with path data strings and Paths, not with full svg xml sources.

Install

npm install bf-svg-path-parse

Usage

Takes an SVG path string. The following code…

---

1const { pathParse, serializePath } = require('bf-svg-path-parse')
2
3const pathDatas = pathParse(__your_path__).getSegments()
4// const pathDatas = pathParse(__your_path__).normalize({round: 2, transform: 'translate(10, 10) scale(0.5)'})
5// const pathDatas = pathParse(__your_path__).relNormalize({round: 2,transform: 'translate(10, 10) scale(0.5)'})
6// const pathDatas = pathParse(__your_path__).absNormalize({round: 2,transform: 'translate(10, 10) scale(0.5)'})
7// const pathDatas = pathParse(__your_path__).absCairo({round: 2,transform: 'translate(10, 10) scale(0.5)'})
8// const pathDatas = pathParse(__your_path__).relCairo({round: 2,transform: 'translate(10, 10) scale(0.5)'})
9
10// out put
11// { err: '',  segments:[ { 'type': 'M', 'args' : [230, 230] }] }
12
13serializePath(pathDatas)
14
15console.log('pathDatas', serializePath(pathDatas))
16
17// out put
18// M896 480C894.656 480 893.536 480.608 892.256 480.768C894.72 479.84 893.568 479.232 892.256 479.232z

API

getSegments

Convert all path commands，data format as follows:

1// example
2{ 
3  err: '',
4  segments:[ 
5    [ 'M', 230, 230 ],
6    [ 'A', 45, 45, 0, 1, 1, 275, 275 ],
7    [ 'L', 275, 230 ],
8    [ 'Z' ] 
9  ] 
10}

normalize

Convert all path commands，data format as follows:

1// example
2{ 
3  err: '',
4  segments:[ 
5    { 'type': 'M', 'args' : [230, 230] },
6    { 'type': 'A', 'args' : [45, 45, 0, 1, 1, 275, 275] },    
7    { 'type': 'l', 'args' : [0, -45] },   
8    { 'type': 'z', 'args' : [] }
9  ] 
10}

absNormalize

Converts all path commands to absolute, data format as follows:

1// example
2{ 
3  err: '',
4  segments:[ 
5    { 'type': 'M', 'args' : [230, 230] },
6    { 'type': 'A', 'args' : [45, 45, 0, 1, 1, 275, 275] },    
7    { 'type': 'L', 'args' : [275, 230] },   
8    { 'type': 'Z', 'args' : [] }
9  ] 
10}

relNormalize

Converts all path commands to relative. Useful to reduce output size, data format as follows:

1// example
2{ 
3  err: '',
4  segments:[ 
5    { type: 'M', args: [ 230, 230 ] },
6    { type: 'a', args: [ 45, 45, 0, 1, 1, 45, 45 ] },
7    { type: 'l', args: [ 0, -45 ] },
8    { type: 'z', args: [] } 
9  ]
10}

absCairo

Converts all path commands to absolute based on cairo and CairoSVG. Converts smooth curves Q/q/T/t/S/s with "missed" control point to generic curves (C), Converts V/v/H/h to lineto (L), data format as follows:

1// example
2{ 
3  err: '',
4  segments:[ 
5    { type: 'M', args: [ 230, 230 ] },
6    { type: 'A',
7      args: [ 230, 230, 0, 1, 1, 45, 0, 45, 3.14, 1.57 ] },
8    { type: 'L', args: [ 275, 230 ] },
9    { type: 'Z', args: [] } 
10  ]
11}

relCairo

Converts all path commands to relative on cairo and CairoSVG. Converts smooth curves Q/q/T/t/S/s with "missed" control point to generic curves (c), Converts V/v/H/h to lineto (l), data format as follows:

1// example
2{ 
3  err: '',
4  segments:[ 
5    { type: 'M', args: [ 230, 230 ] },
6    { type: 'a',
7      args: [ 230, 230, 0, 1, 1, 45, 0, 45, 3.14, 1.57 ] },
8    { type: 'l', args: [ 0, -45 ] },
9    { type: 'z', args: [] } 
10  ]
11}

serializePath

Returns final path string.

License

MIT