En el siguiente código, configuré los márgenes para que no pudiera moverse fuera de los límites de svg de la siguiente manera:
const map = SVG('#map') .size(500, 500) // @ts-ignore: next-line .panZoom({ zoomMin: 1, margins: { top: 500, left: 500, bottom: 500, right: 500, }, }) .zoom(1); Pensé que podría ajustar los márgenes en la devolución de llamada de zoom multiplicando los valores con el level de zoom, pero eso no funciona y hace que la panorámica deje de funcionar:
map.on('zoom', event => { const { level } = event.detail map.panZoom({ margins: { top: 500 * level, left: 500 * level, bottom: 500 * level, right: 500 * level } }) })