Calculating viewBox parameters based on path elements in SVG
svg, viewbox
Solution
OK so I solved it the following way:
removed all letters from the paths string and made an array out of it with
`var values = pathValue.split('L').join(' ').split('M').join(' ').split('z').join('').split(' ');`
found max and min from those values:
`var max = Math.max.apply( Math, values );`
`var min = Math.min.apply( Math, values );`
set the viewBox:
viewBox = max min max max
This worked in my case excellent. Hope that it will be helpful to someone else too.
Problem
I get an XML or JSON with paths only, and I need to recreate the SVG image. I create an empty `<svg xmlns='http://www.w3.org/2000/svg' version='1.1'></svg>`, I add a `<g transform="scale(1 -1)" fill='#aaa' stroke='black' stroke-width='5' ></g>` in it, and then in this element I add all of the paths in it (e.g. `<path d=` ... `/>`). In the end I get a SVG image, but because I haven't set the viewBox attribute in the SVG element the image isn't properly displayed - when I open it in browser, a part of it is displayed full size. Can the viewBox be calculated from the values from the paths? Thank you!