我有一个SVG图像,基本上是一个带有其他点(images
)的背景。
这是我的代码:
<div class="svg-background" style="width: 1920px;>
<svg xml:space="preserve" enable-background="new 0 0 1600 640" viewBox="0 0 1600 640" y="0px" x="0px" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" version="1.1" id="svg" width="100%" height="100%">
<!-- ...SVG code... -->
<image id="point" href="point.png" width="49" height="49" alt="point" class="svg-point" x="100" y="200"/>
<!-- and more points... -->
</svg>
</div>
使用jQuery,我将
#svg-background
div更改为适合浏览器宽度的大小,因此我有一个SVG背景可以适应整个浏览器宽度,并且缩放效果非常好。我的问题是,这些点(
image
元素)也在缩放,而我需要这些点具有固定的宽度和高度。如何防止SVG元素在浏览器窗口调整大小时被缩放?