假设我有一个绘制一些路径的 svg，我应该使用什么工具来找到一个完全适合这些路径的视图框，以便修剪周围的所有冗余空间？
您只需将 svg 的 viewBox 设置为其边界框即可。
function setViewbox(svg) {
var bB = svg.getBBox();
svg.setAttribute('viewBox', bB.x + ',' + bB.y + ',' + bB.width + ',' + bB.height);
}
document.querySelector('button').addEventListener('click', function() {
setViewbox(document.querySelector('svg'));
});
svg { border: 1px solid }
<svg version="1.1" id="svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 500 300" enable-background="new 0 0 500 300" xml:space="preserve" width="250" height="150">
<path fill="none" stroke="#B2E230" d="M413.7,276.5c0,0,67-37,116,0c-24.1-33,16.4-53,0-34s-100-2-75-38" transform="translate(-75,-75)" />
</svg>
<button>setViewbox</button>
注意：它还会考虑路径中不可见的锚点。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
