¿Es posible incrustar o vincular un documento SVG de Inkscape dentro de otro?

16

Me gustaría tomar un pequeño archivo SVG (creado con Inkscape) e incrustarlo o vincularlo en otro (más grande). Cuando se muestra en un navegador, espero ver aparecer el más pequeño dentro de algún marcador de posición del más grande.

¿Es posible?

Keith
fuente

Respuestas:

8

Prefiero <use>que <image>el último se represente con una resolución fija y no se escale como lo hacen los objetos vectoriales normales en el documento actual. http://www.w3.org/TR/SVG11/struct.html#ImageElement

Pero el elemento <use>no puede hacer referencia a archivos SVG completos, su xlink:hrefatributo es una referencia a un elemento / fragmento dentro de un documento SVG ( http://www.w3.org/TR/SVG11/struct.html#UseElement ). El elemento 'use' puede hacer referencia a cualquier recurso local o no local.

ejemplo:

MyLibrary.svg:
<svg (...)>
        <rect x="0" y="0" width="200" inkscape:label="upper-left-blue"
              style="fill:#729fcf;fill-opacity:1;fill-rule:nonzero;stroke:none"
              id="upper-left-blue" height="200"/>

UseParts.svg:
        <use x="0" y="0" width="400" xmlns:xlink="http://www.w3.org/1999/xlink"
             xlink:href="MyLibrary.svg#upper-left-blue" xlink:type="simple"
             xlink:actuate="onLoad" height="400" id="use8793" xlink:show="embed"/>

El soporte de esa función puede variar para diferentes editores / visores SVG, por lo que sé, debería funcionar (al menos) en Inkscape, Firefox y Batik.

Berteh
fuente
Creo que vale la pena señalar que Inkscape agregó soporte para esta característica en la versión 0.91. Agregué el Inkscape ppa para obtener esta versión en Mint 17 (14.04 Ubuntu).
Leif Carlsen
@LeifCarlsen ¿Cómo exactamente? Parece que no encuentro cómo hacerlo en 0.91
rac2030
1
Genero archivos con esta función fuera de Inkscape y visualizo / renderizo con Inkscape.
Leif Carlsen
Hmmm ... bueno, intenté y fallé antes, pero tal vez necesito esforzarme más
rac2030
No importa ... por lo general, es el usuario el que comete el error ... como referencia, simplemente olvidé agregar la definición de xlink ... Agregué el espacio de nombres a la etiqueta svg superior y de repente comenzó a funcionar ;-)
rac2030
3

Use el imageelemento y haga referencia a su archivo SVG. Por diversión, guarde lo siguiente como recursion.svg:

<svg width="100%" height="100%" viewBox="-100 -100 200 200" version="1.1"
     xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink">
  <circle cx="-50" cy="-50" r="30" style="fill:red" />
  <image x="10" y="20" width="80" height="80" xlink:href="recursion.svg" />
</svg>

Fuente: /programming/5451135/embed-svg-in-svg/5451238#5451238

Mirzhan Irkegulov
fuente
De alguna manera, esto da como resultado el mensaje "Imagen vinculada no encontrada" con Inkscape 0.48.4 en Windows al menos.
mlt 12/12/2013
tal vez prefijo xlink: href con "./"? funciona para mi.
Berteh