Retaining line weight when zooming in svgpanzoom

459 Views Asked by At

As demonstrated in this codepen:

https://codepen.io/genworks/pen/EeJNMO?editors=1010

svgpanzoom increases line thickness proportionally to the zoom level, at least with default options e.g. when called like this:

var panZoomSVG1 = svgPanZoom('#svg-1', {
        zoomEnabled: true,
        controlIconsEnabled: true,
        fit: true,
        center: true});

Is there a way to have it retain the original line thickness even when zooming?

1

There are 1 best solutions below

0
On

enchaneta’s comment above answers the question exactly:

You can use this: vector-effect="non-scaling-stroke" as presentational attribute in your SVG. Also you may add it in css: path{vector-effect:non-scaling-stroke;"}