SVG and Canvas

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="9cm"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     version="1.1"
     baseProfile="full">
  <g fill-opacity="0.7" stroke="black" stroke-width="0.1cm">
    <circle cx="6cm" cy="2cm" r="100" fill="red"
                    transform="translate(0,50)" />
    <circle cx="6cm" cy="2cm" r="100" fill="blue"
                    transform="translate(70,150)" />
    <circle cx="6cm" cy="2cm" r="100" fill="green"
                    transform="translate(-70,150)" />
  </g>
</svg>
<ul xmlns:svg="http://www.w3.org/2000/svg">
<li>You can also inline a blue square
<svg:svg width="10" height="10"> 
<svg:rect x="0" y="0" width="10" height="10" fill="blue"/>
</svg:svg>, like this.</li>
</ul>

José M. Vidal .

13 of 23