Incompatibility with viewBox attributes about svgpan HOT 6 CLOSED

Hello Robert,
can you attach/point out a test case? 

The example here http://www.cyberz.org/projects/SVGPan/tiger3.svg has the 
viewBox attribute and seems to work.

Thank you,

Andrea

Hi Andrea,

I've included some test cases which demonstrate the problem.  first of all, 
here are two 'base cases' which don't use SVGPan at all:

1A) viewbox_on_root_respected.svg : This file has a viewBox attribute on the 
root <svg> element without SVGPan.  When displayed in Google Chrome the SVG is 
resized to fit the available space.

2A) viewbox_on_group_ignored.svg : Still without using SVGPan, moving the 
viewBox attribute from the <svg> element to the top-most <g> element results in 
the viewBox being ignored by Chrome. 

Now some cases which include SVGPan.js and which don't work as expected:

1B) svgpan_erratic_with_viewbox_on_root.svg.  This is the same as 1A, with the 
viewBox attribute on the root SVG node, but uses SVGPan in addition. The 
picture starts off at about half of the desired size. Clicking or using the 
mouse wheel causes it to get smaller and smaller (bug!) 

2B) svgpan_viewbox_on_group_ignored.svg  This is the same as 1B, with the 
viewBox attribute on the top-most <g> element.  Again the viewBox is ignored 
for the initial picture size (bug?!) but at least the SVGPan zooming and 
panning functionality works.

So in summary, with the current implementation it looks like I can have a 
correct initial size (1A) or panning and zooming (2B) but not both.

I hope this helps. Let me know if you need more from me.

Thank you,

Rob

I have the same issue with a SVG file. If I include svgpan.js while having an 
viewBox-attribute on the root element, every time I click on the (for panning) 
its size is reduced. This does appear in Chromium, Opera and Firefox.

Testcase:
https://static.thomas-heuer.eu/snippets/svgpan/country_select-original.svg
(the map fills the browser-window, but should not outrun the window-borders)

https://static.thomas-heuer.eu/snippets/svgpan/country_select-svgpan.svg
(the map fills the browser-window for just a second and is instantly scaled 
down, is further scaled down while clicking on the image or using the mouse 
wheel above it)

https://static.thomas-heuer.eu/snippets/svgpan/country_select-svgpan-without-vie
wbox.svg
(the map goes far beyond the viewport, but zooming and panning works as 
expected)

I haven't found a way to fit this image inside the viewport without using 
'viewBox'. Not using 'viewBox' also causes the image to outrun the 
object-boundaries when included in an HTML-file.

Hello Robert,
I've changed the code to handle the viewBox attribute in the root as well. It 
should work. Give it a try on 
http://www.cyberz.org/projects/SVGPan/debug/svgpan_root.svg (original file 
http://www.cyberz.org/projects/SVGPan/debug/svgpan_root2.svg) and 
http://www.cyberz.org/projects/SVGPan/debug/svgpan_group.svg (original file 
http://www.cyberz.org/projects/SVGPan/debug/svgpan_group2.svg).

Andrea

Hello Andrea,

I checked all the above 4 links with the one that had the viewbox attribute in 
Firefox.
It is still not working. 
After I have the viewbox attribute to say viewBox="0 0 200 200" in the svg 
element, Iam unable to neither pan nor zoom the image.
Could you please clarify.

Thanks