javascript - SVG/SVGPan : center graphic upon loading

Question

我一直在使用嵌套 <svg/>和<g/>使 SVG 图形在浏览器框架内居中的元素。外部 svg 元素的宽度和高度为 100%，内部的 x 和 y 设置为 50%。内部 g 元素具有半图像大小的负偏移。这工作正常，但我现在想添加平移和缩放功能。

嵌套 SVG 方法似乎与 SVGPan 不兼容这会让人感到困惑。

仅当我从左上角的图形开始时，SVGPan 才会起作用。我想我必须编写一个在 SCG 加​​载/加载时运行的脚本，以添加一个变换，以与 SVGPan 兼容的方式将顶级 g 居中。

如何初始化我的 <g />用矩阵变换来翻译它？

((viewport.width - g.width)/2, (viewport.width - g.width)/2)

创建 SVG 时，视口(viewport)的大小未知，但我可以在其中放置一些脚本来创建转换或平移。脚本应该放在哪里以及它应该做什么？它需要与 SVGPan 兼容。

Answer 1

Talos 为我解决了这个问题，请参阅 https://github.com/talos/jquery-svgpan/issues/3

而不是

<svg><svg><g></g></svg></svg>

我现在正在使用

<svg><g><svg></svg></g></svg>

这允许居中图形与 [jquery-]svgpan 一起使用。