Вставка (X)HTML-кода в SVG

Для вставки в SVG-документ внешнего содержимого и, в частности, (X)HTML-кода предназначен тег <foreignObject>. Вот пример структуры:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg
     xmlns="http://www.w3.org/2000/svg" version="1.0"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     width="ширина" height="высота">
 <foreignObject x="0" y="40" width="ширина" height="высота" >
   <!-- здесь (X)HTML-код с указанием пространства имен
           xmlns="http://www.w3.org/1999/xhtml"
   -->
 </foreignObject>
</svg>

В следующем примере в SVG-документ вставляется плавающий фрейм (<iframe>), в который загружается одна из страниц моего сайта. При этом фрейм вместе со всем содержимым масштабируется и поворачивается.

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg
     xmlns="http://www.w3.org/2000/svg" version="1.0"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     width="1000" height="800">
<title>Вставка XHTML в SVG</title>
 <foreignObject x="0" y="70" width="1000" height="800" transform="scale(0.7) rotate(-3)">
   <iframe xmlns="http://www.w3.org/1999/xhtml"
           src="http://dunaevv1.narod.ru/introduct.html"
           width="1000" height="800">
   </iframe> 
 </foreignObject>
</svg>

Посмотреть пример