Как сделать ссылки во встроенном SVG файле открытыми в главном окне, а не в отдельном объекте

У меня есть SVG файл (сгенерированный Graphviz), содержащий ссылки на URL. Я бы хотел, чтобы эти ссылки были доступны для просмотра. Сначала я попробовал

<img src="path/to/my.svg"/>

который отображает изображение в порядке, но ссылки не доступны. Изменение объекта:

 <object data="/path/to/my.svg" type="image/svg+xml">

делает ссылки доступными, но когда пользователь нажимает на них, новая страница открывается внутри объекта. Есть ли способ открыть ссылки в главном окне?

Это использует firefox 5.0, но если есть различия между браузерами, о которых вы знаете, я был бы признателен за предупреждение!

Ответы

Ответ 1

Во-первых, если вы вставляете SVG в качестве <img>, браузеры не будут открывать ссылки, а также не будут запускать скрипты внутри <img>, потому что, ну, вы вставляете изображение, и, скорее всего, ваш образ может появиться внутри a <a>, и вы не можете поместить ссылки внутри ссылок.

Чтобы открывать ссылки в новых вкладках, вы можете использовать либо атрибут target, как и в HTML, или атрибут xlink:show, специфичный для xlink, со значением new. Спецификация SVG говорит следующее:

Атрибут

[xlink: show] предоставляется для обратной совместимости с SVG 1.1. Он предоставляет документацию для XLink-совместимых процессоров. В случае конфликта целевой атрибут имеет приоритет, поскольку он может выражать более широкий диапазон значений.

И значения атрибута target могут быть:

  • _replace
  • _self
  • _parent
  • _top
  • _blank

Таким образом, в вашем SVG вам необходимо написать следующее:

<a xlink:href="#" onclick="location.href='http://example.com'; return false;" target="_blank">[...]</a>

Но в настоящее время все браузеры, способные показывать SVG, поддерживают как атрибуты xlink:show, так и target (я еще не тестировал в IE9).