This example demonstrates an interactive SVG pan-and-zoom interface built with the react-svg-pan-zoom library. It renders a set of overlapping geometric shapes—three circles and a rectangle—inside a 500×500 pixel viewport, with buttons that trigger zooming, fitting to a selection, or fitting the entire SVG to the viewer. The component tracks zoom and pan events through console logging, and uses the `fitToViewer` method on initial mount to center the scene. The visualization is constructed using basic SVG elements such as `<rect>` and `<circle>`, with React handling the UI state.