<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:xhtml="http://www.w3.org/1999/xhtml">
<text x="0" y="15">There should be only one animated image here, rotated, and not clipped:</text>
<g transform="rotate(45,100,250)" >
<rect fill="yellow" stroke="#000000" stroke-width="2" x="60" y="60" width="170" height="170" />
<foreignObject x="70" y="70" width="150" height="150" >
<xhtml:img src="resources/3dolph.gif" width="150" height="150" />
</foreignObject>
</g>
<text x="0" y="400">The animated image below should look like the one above:</text>
<g transform="translate(0, 400) rotate(45,100,250)" >
<rect fill="yellow" stroke="#000000" stroke-width="2" x="60" y="60" width="170" height="170" />
<image xlink:href="resources/3dolph.gif" x="60" y="60" width="170" height="170" />
</g>
</svg>