2

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?

djc
  • 31
  • 4
  • 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;"}` – enxaneta Sep 22 '18 at 19:26
  • 1
    Awesome, thank you! That's exactly what I was looking for. Works like a charm (updated the pen to include it). – djc Sep 22 '18 at 19:57

1 Answers1

0

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;"}

djc
  • 31
  • 4