背景图像不使用 SVG 缩放和平移
Background image not zooming and panning with SVG
我有一个 SVG 和一个背景图片。我正在尝试放大和缩小 SVG，以及平移。我可以使用缩放和平移功能，但我的背景图像无法正常工作。同样的，我可以左右摇，背景图会跟着，但是上下摇就不会了。
我不能为此使用任何库，例如svg 平移缩放。真正的应用是触摸屏，onclick 事件将变成 touchstart 事件，链接到不同的 SVG。但是，对于我的问题，我使用按钮使其保持简单。
我还希望我的背景图片添加 CSS 而不是与 SVG 内嵌，因为这会增加 SVG 文件的大小。
我还需要 div 保持相同大小，以便进行平移。
肯定有办法以相同的方式同时缩放 SVG 和背景图像吗？
这是我的 JSFiddle。
（该脚本似乎无法在 JSfiddle 中运行，但会在 运行 服务器上运行）。
I'd also prefer to have my background image added with CSS and not inline with the SVG, as this will increase the SVG file size.
这不准确。如果您通过 SVG 中的 <image> link 背景图片，它不会像使用 CSS 那样增加 SVG 的大小。
它会随着您的 SVG 的其余部分移动和缩放，而无需做任何额外的工作。
我有一个 SVG 和一个背景图片。我正在尝试放大和缩小 SVG，以及平移。我可以使用缩放和平移功能，但我的背景图像无法正常工作。同样的，我可以左右摇，背景图会跟着，但是上下摇就不会了。
我不能为此使用任何库，例如svg 平移缩放。真正的应用是触摸屏，onclick 事件将变成 touchstart 事件，链接到不同的 SVG。但是，对于我的问题，我使用按钮使其保持简单。
我还希望我的背景图片添加 CSS 而不是与 SVG 内嵌，因为这会增加 SVG 文件的大小。
我还需要 div 保持相同大小，以便进行平移。
肯定有办法以相同的方式同时缩放 SVG 和背景图像吗？
这是我的 JSFiddle。 （该脚本似乎无法在 JSfiddle 中运行，但会在 运行 服务器上运行）。
I'd also prefer to have my background image added with CSS and not inline with the SVG, as this will increase the SVG file size.
这不准确。如果您通过 SVG 中的 <image> link 背景图片，它不会像使用 CSS 那样增加 SVG 的大小。
它会随着您的 SVG 的其余部分移动和缩放，而无需做任何额外的工作。