Geek Answers Handbook

How to get ScrollBars in SVG for multiple content

I want to have an SVG container that contains four SVG contents. Now these four SVG contents contain more content than can fit in the area allocated to them in the container's SVG, so I require the scroll bars to be displayed automatically so that the full svg content is viewed by the user by scrolling.

I tried setting new viewports by adding the width and height of the attributes, but the scrollbars are not showing. I even tried using the overflow property with scroll and auto values, but still the scroll bars are not showing.

What is the correct solution to this problem?

+5
svg
source share
1 answer

At the moment, the answer is that you need to provide your own pan / scroll functions, there is no way to get scroll bars inside svg, except that it is possible to wrap them inside another html container via foreignObject (which is likely to be suboptimal).

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

+4
source share

More articles:


All Articles