多层SVG嵌套,通过viewBox放大外层SVG时内层会逐渐消失。

问题:
多层SVG嵌套使用时候,通过设置viewBox控制最外层SVG的缩放,内层会跟着缩放,但是放大到一定程度,内层会逐渐消失。
原因:
内层没有设置高宽!!!
高宽默认100%,随外层的缩放也在变化,导致外层放大到一定程度,外层高宽小于内层原始高宽,超过部分被遮蔽。
效果对比图:
多层SVG嵌套,通过viewBox放大外层SVG时内层会逐渐消失。
内层SVG的原始高宽,可用Ai软件打开(文档设置-编辑画板)查阅。
多层SVG嵌套,通过viewBox放大外层SVG时内层会逐渐消失。