Включить файл SVG в SVG

Question

У меня есть linearGradient в разделе defs моего SVG-файла, и я ссылаюсь на него с помощью fill = "url (#myGradientName)". Это прекрасно работает до сих пор.

Я думаю, что смогу поместить весь раздел defs в свой собственный файл SVG, а затем просто сослаться на это из всех моих изображений SVG. То есть что-то вроде:

styles.svg:

<svg xmlns=...>
  <defs>
    <linearGradient id="myGradient" ...>
    </linearGradient>
  </defs>
</svg>

image.svg:

<svg xmlns=...>
  <rect width="100" height="100" fill="styles.svg#myGradient"/>
</svg>

Но я не могу заставить стиль применить. У меня неправильный синтаксис для идентификаторов, внешних для этого файла (styles.svg # myGradient)? Нужно ли сначала как-то явно включать файл?

Я пролил свет на спецификацию SVG, и похоже, что это возможно, но ни один из примеров на самом деле не показывает, как это делается.

Edit: FOP FAQ предполагает, что правильный синтаксис - это fill = "url (grad.svg # PurpleToWhite)", но он не работает в Gecko или Webkit. Это правильно, и никто не поддерживает это, или я делаю что-то еще неправильно?

Answer 1

Похоже, это поддерживается только в Firefox 3.1 .

Answer 2

Вы должны сказать fill="url(styles.svg#myGradient)". Это работает в Firefox 4 beta 6, и я думаю, что это работает в Firefox 3.5. Но Chrome (7.0.517.41 beta) и IE9 beta (9.0.7930.16406) по-прежнему не поддерживают это. Похоже, они оба ищут #myGradient в текущем документе, вместо того, чтобы фактически перейти к указанному URL. Gross.

Вот полные файлы, которые я использовал для проверки этого:

styles.svg

<svg xmlns="http://www.w3.org/2000/svg">
  <defs>
    <linearGradient id="myGradient">
      <stop offset="0" stop-color="red" />
      <stop offset="1" stop-color="black" />
    </linearGradient>
  </defs>
</svg>

image.svg

<svg xmlns="http://www.w3.org/2000/svg">
  <rect width="100" height="100" fill="url(styles.svg#myGradient)"/>
</svg>

Answer 3

Думаю, я только что ответил на ваш вопрос в этой теме здесь .

Answer 4

На самом деле, часто задаваемые вопросы о FOP верны, правильный синтаксис охватывает URI с url(...). Только что проверил мой Firefox, и он обрабатывает только с окружающими url(). Это было бы ошибкой в ​​Safari или Opera, если бы они обрабатывали это по-другому.

Я случайно задал аналогичный вопрос , но с таким же небольшим успехом.

Приветствия