SVGサンプル / 図形のグループ化:symbol


<svg xmlns="http://www.w3.org/2000/svg">

<symbol id="figs" fill="lightgreen" fill-opacity="0.5">
    <rect width="50" height="50" /<
    <rect x="20" y="20" width="50" height="50" /<
</symbol<

<symbol id="figs2" width="70" height="70" fill="lightgreen" fill-opacity="0.5" viewBox="0 0 100 100"<
    <rect width="50" height="50" /<
    <rect x="20" y="20" width="50" height="50" /<
</symbol<

<use x="10" y="10" xlink:href="#figs"/<
<use x="120" y="10" xlink:href="#figs2"/<

</svg>

© wonder-boys.net all rights reserved.