É possível incorporar ou vincular um documento SVG do inkscape dentro de outro?


16

Gostaria de pegar um pequeno arquivo SVG (criado com o Inkscape) e incorporá-lo ou vinculá-lo a outro (maior). Quando exibido por um navegador, espero ver o menor aparecer dentro de algum espaço reservado para o maior.

É possível?

Respostas:


8

Prefere <use>a <image>como o mais tarde é processado em uma resolução fixa e não escala como objetos regulares vetor fazer no documento atual. http://www.w3.org/TR/SVG11/struct.html#ImageElement

Mas o elemento <use>não pode fazer referência a arquivos SVG inteiros, seu xlink:hrefatributo é uma referência a um elemento / fragmento em um documento SVG ( http://www.w3.org/TR/SVG11/struct.html#UseElement ). O elemento 'use' pode fazer referência a qualquer recurso local ou não local.

exemplo:

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"/>

O suporte a esse recurso pode variar para diferentes editores / visualizadores de SVG, tanto quanto eu sei que deve funcionar (pelo menos) no Inkscape, Firefox e Batik.


Eu acho que vale a pena notar que o Inkscape adicionou suporte para esse recurso na versão 0.91. Adicionei o Inkscape ppa para obter esta versão no Mint 17 (14.04 Ubuntu).
Leif Carlsen

@LeifCarlsen Como exatamente? Eu pareço não encontrar como fazê-lo em 0,91
#

1
Gero arquivos com esse recurso fora do Inkscape e visualizo / renderizo com o Inkscape.
Leif Carlsen

Hmmm ... ok eu tentei e não conseguiu isso antes, mas talvez eu precise tentar mais
rac2030

Ha deixa pra lá ... geralmente é o usuário que comete o erro ... para referência, esqueci-me de adicionar a definição xlink ... adicionei o namespace à tag svg superior e de repente ele começou a funcionar ;-)
rac2030

3

Use o imageelemento e faça referência ao seu arquivo SVG. Por diversão, salve o seguinte 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>

Fonte: https://stackoverflow.com/questions/5451135/embed-svg-in-svg/5451238#5451238


De alguma forma, isso resulta na mensagem "Imagem vinculada não encontrada" com o Inkscape 0.48.4 no Windows, pelo menos.
Mlt

talvez prefixe o xlink: href com "./"? funciona para mim.
Berteh 07/07
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.