web-dev-qa-db-fra.com

Comment créer des liens dans un fichier SVG intégré ouvert dans la fenêtre principale, et non dans un objet séparé

J'ai un fichier SVG (généré par graphviz ) contenant des liens d'URL. Je voudrais que ces liens soient cliqués. D'abord j'ai essayé

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

qui affiche l'image bien, mais les liens ne sont pas cliqués. Changer à l'objet:

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

donne les liens cliquables, mais lorsque l'utilisateur clique sur eux, la nouvelle page s'ouvre à l'intérieur de l'objet. Y a-t-il un moyen de rendre les liens ouverts dans la fenêtre principale?

Ceci utilise Firefox 5.0, mais s'il y a des différences entre les navigateurs croisés, vous savez que j'apprécierais l'avertissement!

37
mojones

Premièrement, si vous avez emballé SVG comme <img>, les navigateurs n'ouvrent pas les liens, ainsi qu'ils ne courent pas de scripts à l'intérieur <img>, car, bien, vous avez incorporé une image et votre image peut-être très probablement apparaître à l'intérieur d'un <a>, et vous ne pouvez pas mettre des liens à l'intérieur des liens.

Et pour établir des liens ouverts dans de nouveaux onglets, vous pouvez utiliser l'attribut target, comme dans HTML ou XLink-spécifique xlink:show attribut avec la valeur new. Les spécifications SVG dit ce qui suit:

[XLINK: Afficher l'attribut est prévu pour la compatibilité vers l'arrière avec SVG 1.1. Il fournit une documentation aux processeurs de XLink-Aware. En cas de conflit, l'attribut cible a la priorité, car elle peut exprimer une gamme de valeurs plus large.

Et les valeurs de l'attribut target peuvent être:

  • _remplacer
  • _soi
  • _parent
  • _Haut
  • _Vide

Ainsi, dans votre SVG, vous devez écrire comme suit:

<a xlink:href="http://example.com" target="_blank">[...]</a>

Mais actuellement tous les navigateurs capables de montrer le support SVG à la fois xlink:show et target attributs (je n'ai pas été testé dans IE9, cependant).

46
Spadar Shut