Image SVG avec un border / contour

Je suis en train d'ajouter un cadre autour d'une image svg. J'ai essayé les 2 méthodes, mais les deux ont échoué...

Tentative 1 : Dessine l'image mais pas de frontière..

<image id="note-0" xlink:href="http://example.com/example.png" x="185" y="79" height="202" width="150" style="stroke:#ac0d0d; stroke-width:3;"></image>

Tentative 2 : Dessine l'image mais pas de frontière..

<defs>
    <image id="image1352022098990svg" height="202" width="150" xlink:href="http://example.com/example.png"></image>
</defs>

<use xmlns="http://www.w3.org/2000/svg" id="note-0" xlink:href="#image1352022098990svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="185" y="79" height="202" width="150" style="stroke:#ac0d0d; stroke-width:3;"/>

Donc ma question est, est-il possible de définir une image sur un élément svg et avoir un border/contour autour d'elle en même temps?

D'ailleurs il me semble position svg éléments à traduire et avec le x/y de l'attribut. Qui est préférée et pourquoi?

OriginalL'auteur Baijs | 2012-11-04

  1. 27

    avc ne s'applique pas aux <image> ou <use>, seulement des formes et du texte. Si vous voulez dessiner une bordure autour d'elle, dessiner un <rect> après l'image avec le même x,y,largeur et hauteur de l'image et lui donner un coup et un remplissage de "none".

    De le traduire vs x/y - cela dépend de votre cas d'utilisation.

    Merci, j'avais peur que im en utilisant un rect maintenant, merci.
    Pourrait cette frontière suit exactement l'image de sa forme?
    Vous pouvez suivre un chemin dans un outil tel que Inkscape ronde toute forme que vous voulez.

    OriginalL'auteur Robert Longson