它可能在svg位置插入图像链接?

时间:2017-06-24 02:08:35

标签: svg position graphic-design

我试图在带有文字的svg位置插入图像链接

这是我的代码

<svg width="100" height="100">
 <circle cx="20" cy="20" r="20" fill="green" />
       <circle cx="70" cy="70" r="20" fill="purple" />
  <text x="20" y="20" font-family="sans-serif" font-size="20px"     
  fill="red">Hello!</text>
<image      xlink:href="https://s-media-cache-ak0.pinimg.com/736x/76/47/9d/76479dd91dc55c2768ddccfc30a4fbf5--pikachu-halloween-costume-diy-halloween-costumes.jpg"        />
   </svg>

我如何做到这一点

请帮帮我

1 个答案:

答案 0 :(得分:0)

SVG中的图片(<image>)需要指定widthheight。如果您没有给出宽度和高度,它们默认为0,这意味着图像将不可见。

<svg width="100" height="100">
 <circle cx="20" cy="20" r="20" fill="green" />
       <circle cx="70" cy="70" r="20" fill="purple" />
  <text x="20" y="20" font-family="sans-serif" font-size="20px"     
  fill="red">Hello!</text>
  <image xlink:href="https://s-media-cache-ak0.pinimg.com/736x/76/47/9d/76479dd91dc55c2768ddccfc30a4fbf5--pikachu-halloween-costume-diy-halloween-costumes.jpg"
         x="10" y="50" width="37" height="37"/>
</svg>