SVG and Canvas

Defs and Use

<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="250px"
     xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" baseProfile="full">
  <g fill-opacity="0.7" stroke="black" stroke-width="0.1cm">
<defs>
<g id="group1" fill="green" opacity="0.9" >
<rect x="20" y="20" width="100" height="100" opacity="0.5" />
<rect x="80" y="80" width="100" height="100" fill="gray" />
</g>
</defs>
<use x="0" y="0" width="200" height="200" xlink:href="#group1" />
<use x="0" y="0" width="200" height="200" xlink:href="#group1" transform="rotate(70, 100, 100)" />
  </g>
</svg>

José M. Vidal .

20 of 24