Sprite SVG


#1

Доброго дня.

Извлёк свг из иллюстратора, немного преобразовал, чтобы можно было его вставить спрайтом в страницу:

<svg>
	<symbol  id="android" viewBox="0 0 42.1 47" width="43" height="47">
<path fill="#A4C639" d="M34.1,14H7.9c0,0.1,0,0.2,0,0.3v18.8c0,1.9,1.5,3.5,3.3,3.6v7.4c0,1.6,1.3,2.9,2.9,2.9
	c1.6,0,2.9-1.3,2.9-2.9v-7.4h8.1v7.4c0,1.6,1.3,2.9,2.9,2.9c1.6,0,2.9-1.3,2.9-2.9v-7.4c1.9-0.1,3.3-1.7,3.3-3.6V14.3
	C34.2,14.2,34.2,14.1,34.1,14z"/>
<path id="c-4-9-2-9-2-9" fill="#A4C639" d="M2.9,15.7L2.9,15.7c1.6,0,2.9,1.3,2.9,2.9v12.4c0,1.6-1.3,2.9-2.9,2.9l0,0
	c-1.6,0-2.9-1.3-2.9-2.9V18.6C0,17,1.3,15.7,2.9,15.7z"/>
<path id="c-4-1-7-3-8-4" fill="#A4C639" d="M39.2,15.7L39.2,15.7c1.6,0,2.9,1.3,2.9,2.9v12.4c0,1.6-1.3,2.9-2.9,2.9l0,0
	c-1.6,0-2.9-1.3-2.9-2.9V18.6C36.3,17,37.6,15.7,39.2,15.7z"/>
<path fill="#A4C639" d="M8,12h26c0-2.8-1.2-5.3-3.2-7.3l2.4-4.2c0.1-0.1,0-0.3-0.1-0.4c-0.1-0.1-0.3,0-0.4,0.1l-2.4,4.1
	c-2.1-1.9-6.2-3.4-9.4-3.4l0,0c-3,0-7.3,1.5-9.4,3.4L9.3,0.2C9.2,0,9,0,8.9,0C8.7,0.1,8.7,0.3,8.8,0.5l2.4,4.2C9.3,6.6,8.1,9.2,8,12
	z M25.3,6.8c0-0.8,0.7-1.5,1.5-1.5c0.8,0,1.5,0.6,1.5,1.5c0,0,0,0,0,0c0,0.8-0.7,1.5-1.5,1.5C26,8.3,25.3,7.6,25.3,6.8
	C25.3,6.8,25.3,6.8,25.3,6.8z M14.2,6.8c0-0.8,0.7-1.5,1.5-1.5c0.8,0,1.5,0.6,1.5,1.5c0,0,0,0,0,0c0,0.8-0.7,1.5-1.5,1.5
	C14.9,8.3,14.2,7.6,14.2,6.8C14.2,6.8,14.2,6.8,14.2,6.8z"/>
	</symbol>

Используя <svg width="43" height="47"><use xlink:href="../pink/img/sprite.svg#android"></use></svg> вставляется пустой блок, может кто подскажет в чём проблема?


#2

Кажется дело в содержимом SVG. Я поигрался с файлом. Изображение видно если вместо <svg> использовать <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">


#3

Получилось разобраться? В чем была проблема?


#4

что-то не особо получается через use использовать( пока отложил всё это дело и вставляю напрямую к код html, svg, ибо есть задачи по-важнее.


#5

все расписанно тут - https://codepen.io/Bik-Top/pen/gZXppX?editors=1000


#6

SVG спрайты в браузере не видно как обычный SVG
Спрайты требуют сборщика типа svg-sprite