Fusionner plusieurs fichiers SVG en un seul

tout d'abord je sais qu'il y a beaucoup de semblable à ce genre de questions, mais aucune d'entre elles semblent faire l'affaire pour moi. J'aimerais savoir si il y a moyen de combiner de multiples fichiers svg dans un seul fichier. Un peu comme ceci:

<svg id="background" ...>
   <svg id="first" ...>
       ...
   </svg>
   <svg id="second" ...>
       ...
   </svg>
   ...
</svg>

Est-il une sorte de modèle ou un tutoriel qui m'aide à faire cela? En fin de compte, je veux le faire par programmation à l'aide de java et javafx 2.2.

Merci d'avance pour votre aide!

source d'informationauteur user1582432

  1. 9

    Pour changer le format SVG exactement de cette façon, vous devriez vérifier mon fichier SVG Empilement Outil. Comme SVGs sont XML, on peut utiliser XSLT pour transformer les données:

    Mise à jour: Comme l'a souligné dans les commentaires, il semble y avoir un bug de sorte que le fichier SVG est demandé plusieurs fois. Plus de détails et une solution peut être trouvée ici:

  2. 3

    Vous pouvez essayer svg-rejoindre pour combiner plusieurs SVG en un symbole de la collection.

    Cet outil créer deux fichiers pour vous.
    La première est "svg-bundle.svg":

    <svg ...>
  <symbol id="svg1" ...>
  <symbol id="svg2" ...>
</svg>

    Chaque symbole est séparé fichier SVG.

    Le dernier est "svg-bundle.css":

    .svg_svg1,
.svg_svg2 {
  width: 20px; //for example
  height: 20px;
}

    Maintenant, vous pouvez l'utiliser dans votre code html:

    <link rel="stylesheet" type="text/css" href="svg-bundle.css" />
...
<svg class="svg_svg1"><use xlink:href="svg-bundle.svg#svg1"></svg>
<svg class="svg_svg2"><use xlink:href="svg-bundle.svg#svg2"></svg>
  3. -1

    Vous dites que vous l'avez entièrement distincts des documents SVG? Dans ce cas, quel est le point d'essayer de le fourrer dans un document? Je suis confus.

    Si ce que tu veux dire, c'est que vous voulez placer un élément svg dans un autre, c'est tout à fait possible, et, dans ce sens, votre échantillon est syntaxiquement correct.

    Si pour quelque raison vous voulez vraiment de tenir ce sont intrinsèquement documents distincts dans un seul document SVG, alors je suppose que vous pourriez utiliser CSS pour activer l'affichage de chaque sur et en dehors.

    #first, #second { display: none; }
.display-first #first { display: block; }
.display-second #second { display: block; }

function toggle_first () { document.body.classList.toggle("first"); }

    ou quelque chose le long de ces lignes.