Importer un .svg dans un autre .svg

Bonjour, dans le but de créé une carte de jeu dans un format vectoriel,
j'ai créé des "tuiles" sous inkscape, et une carte devant insérer et aligner toutes ces tuiles qui elle est générée par php.

Voici le code d'une tuile:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<?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 version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="38.64px" height="29.32px" viewBox="0 0 38.64 29.32" enable-background="new 0 0 38.64 29.32" xml:space="preserve">
<g id="Layer_2">
	<g id="_x30__x2C_0_1_">
		<polygon fill="#CB9F67" points="14.143,29.32 0,22.249 0,12.248 14.143,10.353" />
		<polygon fill="#B17F4C" points="33.461,26.732 38.639,16.902 38.639,7.071 33.461,7.765" />
		<polygon fill="#A0642F" points="33.461,7.765 14.143,10.353 14.143,29.32 33.461,26.732" />
		<polyline fill="none" stroke="#BE894A" points="0,12.248 38.639,7.071 38.639,17.072 33.461,26.732 14.143,29.32 0,22.249 0,12.248" />
	</g>
</g>
<g id="Layer_1">
	<g id="_x30__x2C_0">
		<polyline fill="#80C41C" stroke="#40A629" points="5.177,2.589 24.496,0.001 38.639,7.071 33.461,16.731 14.143,19.319 0,12.248 5.177,2.589" />
	</g>
</g>
</svg>

Et un morceau de code de la carte:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
	<svg externalResourcesRequired="true" width="500" height="500" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
		<defs>
			<title>Astar: carte à cases hexagonales orientées verticalement</title>
			<image id="herbe" width="38,64" height="29,32" xlink:href="../images/herbe.svg" />
		</defs>
		<g id="map">
			<g class="tuile" id="x:0y:0"><use xlink:href="#herbe" x="220.45407685049" y="0" />
			<text x="230.45407685049" y="15" fill="white">0,0</text></g>
			<g class="tuile" id="x:0y:1"><use xlink:href="#herbe" x="195.95917942265" y="12.247448713916" />
			<text x="205.95917942265" y="27.247448713916" fill="white">0,1</text></g>
			<g class="tuile" id="x:0y:2"><use xlink:href="#herbe" x="171.46428199482" y="24.494897427832" />
			<text x="40" y="440">Résolution impossible</text>
		</g>
	</svg>

Bien évidemment, tout ce que j'arrives à obtenir, c'est une page blanche avec seulement les balise <text> affiché.

J'ai essayer sans passer par use, et même avec des fichiers .jpg, le résultat reste le même. J'ai était très étonné par le manque d'informations sur internet (n'étant pas du genre à poster dès que j'ai un problème). J'ai regarder sur plusieurs sites, télécharger de nouveau navigateurs(Opéra, FF & Amaya) en pensant à un problème avec mon nav actuel (quand même chrome...).

Merci d'avance pour tout élément de réponse dans le bon sens =)