如何将 SVG 调整为不同的大小答案

【问题标题】：How to Resize SVG to different sizes如何将 SVG 调整为不同的大小
【发布时间】：2012-08-03 17:24:47
【问题描述】：

我在我的项目中使用Jquery SVG 插件。我想将我的 svg 调整为不同的大小我已经编写了以下代码来加载较小尺寸的 svg

 $('#svgbasics').svg({
            loadURL: 'lion.svg', // External document to load 
            onLoad: null, // Callback once loaded 
            settings: {width: '100px'}, // Additional settings for SVG element 
            initPath: ''
        })

但它总是以 100% 大小打开图像，请任何人帮助我如何显示不同大小的 SVG

【问题讨论】：

#svgbasics 元素的宽度设置是多少？
这就是我的困惑，我该如何设置宽度、高度和视图框
$('#svgbasics').css('width','100px');
这样调整了 div 的大小，但 SVG 的大小保持不变

标签： jquery jquery-plugins svg jquery-svg

【解决方案1】：

搜索了几天后，我发现了以下内容

如果你想调整你的 svg 的大小，那么我们必须调整 svg 的 viewbox 的大小，设置宽度只会调整外部显示区域的大小

我们可以通过简单地在图像标签中显示它来调整svg的大小并根据需要调整它的大小即

<img width="200px" src="lion.svg"></img>

我在下面的帖子中找到了答案

How do I scale a stubborn SVG embedded with the <object> tag?

【讨论】：

最好使用 object、embed 或 iframe：您会得到相同的结果，但您也可以操作 svg 内部 dom（如您提到的链接中所述）