1
votes

as I understand, svg transformations such as scaling apply to the whole svg object, I.e. not only to vector-points, but also to thickness and width of lines. I.e. a `transform= "scale(10)" operation means, that the line width is 10 times thicker than without this transform.

Is there a way to apply such a transformation to vertices of the paths only? I would like to keep consistent path widths.

Lets say I have the following SVG file:

<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.0" xmlns="http://www.w3.org/2000/svg" >
<polygon transform="scale(10) translate(100,100)" style=" fill: rgba(255,255,255,0);  stroke: black; " points=" 100.0,0.0 49.99999999999997,86.60254037844388 -49.99999999999998,86.60254037844388 -100.0,1.2246467991473532E-14 -49.999999999999964,-86.60254037844388 49.999999999999936,-86.6025403784439 100.0,-2.4492935982947064E-14" />
</svg>
1

1 Answers

4
votes

Sure, set vector-effect="non-scaling-stroke" That will work on Opera, Chrome, Safari and Firefox. There's an example here.