CODEWITHSUNDEEP
sizetransformscaledimensionviewbox
ubuntux
ubuntux

Reputation: 101

Perform transform on svg viewbox

I have a need to scale SVG's using javascript. This is part of a workflow so I'll be processing these endlessly in a browser.

The issue is the incoming SVG's viewbox is 0,0,14032.00mm,9922.00mm which is an aspect ratio to A4 paper. I need to scale the SVG down to 0,0,297.00mm,210.00mm without cropping the elements, they should also scale to remain within the viewbox.

Once they are scaled I can determine the scale factor and correctly adjust the stroke-widths — this much works already. However, my math breaks down quite badly with the bezier elements. I frequently run into NaN errors. I'm wondering if I'm over thinking this and there is maybe an easier way to scale that individually scaling every single element...

This is not about scaling the viewbox to fit on screen, that's not my issue.

I was wondering if there was a simple way to perform a transform matrix or transform scale on the viewbox itself. I have not been able to find an answer because all the questions are about scaling the viewbox to the browser element container which is not what I need.

If I can scale the viewbox directly it may allow me to create a loop to apply the matrix to all elements?

Upvotes: 0

Views: 26

Answers (0)

Related Questions