Obraz SVG z obramowaniem / obrysem

Próbuję dodać obramowanie wokół obrazu svg. Próbowałem 2 podejść, ale oba nie powiodły się ...

Próba 1: Rysuje obraz, ale bez obramowania ..

<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>

Próba 2: Rysuje obraz, ale bez obramowania ..

<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;"/>

Moje pytanie brzmi: czy możliwe jest zdefiniowanie obrazu na elemencie svg i jednoczesne obramowanie / obrys wokół niego?

Ponadto wydaje mi się, że mogę pozycjonować elementy svg za pomocą translate iz atrybutem x / y. Co jest preferowane i dlaczego?

questionAnswers(1)

yourAnswerToTheQuestion