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 S
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: