如何在html5中显示SVG圈内的图像？

Question

有没有办法在SVG Circle内显示图像？

我尝试在Svg元素中添加图像,但图像不会出现在圆圈中.

<svg width="100" height="100">
<circle cx="50" cy="50" r="40"stroke="green" stroke-width="4" fill="yellow" />
<img src="starkeen_ane.jpg"/>
 </svg>

你能帮助我吗？

Answer 1

以下是一个关于Havenard上述评论的例子:

http://jsfiddle.net/9zkfodwp/1/

实际上,您不会<circle>在内部绘制带有图像的元素 - 而是定义圆形剪辑路径,并将其设置为<image>标记上的"剪辑路径"属性.