Изображение не рендерится внутри SVG <symbol> - PullRequest
0 голосов
/ 30 октября 2019

У меня есть спрайт SVG, подобный этому:

<svg xmlns="http://www.w3.org/2000/svg">
  ...
  <symbol id="logo-vitrine" xmlns="http://www.w3.org/2000/svg" width="64" height="78" viewBox="0 0 64 78">
      <path fill="url(#a)" d="M0 0h64v78H0z"/>
      <defs>
          <pattern id="a" width="1" height="1" patternContentUnits="objectBoundingBox">
              <use transform="scale(.01563 .01282)" xlink:href="#b"/>
          </pattern>
          <image id="b" width="64" height="78" xlink:href="data:image/png;base64,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"/>
      </defs>
  </symbol>
  ...
</svg>

Если я удаляю тег <symbol>, SVG рендерится нормально ... почему? Что я делаю не так?

Я называю этот символ так:

<svg width="64" height="78">
  <use href="/images/svg/icons.svg#logo-vitrine" />
</svg>
...