svg viewbox

SVG:
viewBox是SVG的虚坐标系,比VML的简单不少。
为根节点svg元素加上viewBox属性后,在svg下的各图形元素的大小和位置都是按viewBox限定的坐标,而不是页面的实际坐标。
如:
<svg width="100px" height="100px" viewBox="0 0 300 300">
<g>
 <rect x="5" y="15" width="200" height="200"/>
</g>
</svg>
在100x100的svg区域中,放入一个200x200的方块,按理不能正常显示,会被裁去一部分。但是因为加入了viewBox属性,svg区域会完整显示rect。可以理解为在svg中加入一个新坐标系,按上例把svg划分为300x300份,rect占用200x200份,而不是像素,实际图形会缩放或拉伸。