How to gets ScrollBars in SVG for multiple content

Question

I want to have a container SVG which contain four SVG contents. Now these four SVG content has more content than can fit in the area allocated to them within the container SVG, hence I require that scrollbars appear automatically so that the full svg content can be seen by the user by scrolling.

I have tried establishing new viewports by adding the attributes width and height but scroll bars do not appear. I even tried using the overflow property with values of scroll and auto but still scrollbars do not appear.

What is the correct solution to this problem ?

Answer 1

At the moment the answer is that you need to provide your own panning/scrolling functions, there's no way to get scrollbars inside of the svg apart from possibly wrapping it inside another html container via foreignObject (which would likely be suboptimal).

Here are some resources to get you started with custom svg scrollbars:

• http://www.carto.net/papers/svg/gui/scrollbar/
• http://www.treebuilder.de/default.asp?file=67211.xml
• http://www.dotuscomus.com/svg/lib/library.html