如何将图像放在与拉斐尔Js的圆圈内

我试图把图像放在圆圈内，但没有成功。这是我的代码：如何将图像放在与拉斐尔Js的圆圈内

//Elms.raphael() is my stage. 
var circle = Elms.raphael().circle(730, 200, 0); 
circle.attr({ fill : 'url(myImg.jpg)' });     

setTimeout(function() 
{ 
    circle.animate({ 'stroke' : '#000', r : 90, 'stroke-width' : '5' }, 300); 
}, 250);

而不是把图像放在圆圈它变成黑色（“＃333”）着色。我也试图制作一个图像对象，但仍然不起作用。

请帮忙吗？

来源

2013-08-02 Ericks

另一种方法，如果你有单独的图像，并想把它带到你的圆圈对象。

这使整个图像显示更小的尺寸，适合你圈。 DEMO

var r = new Raphael(10,10, 500, 500); 
var c = r.circle(200, 200, 80).attr({stroke: 'red', "stroke-width" : 3}); 

var img = r.image("http://www.eatyourcareer.com/wp-content/uploads/2012/06/ok-256x2561.png", 100, 105, 200, 200);

来源

2013-08-02 21:35:55 Brian

嗯......因为我无法用我的形象填满这个圈子，我会这样做。谢啦。 – Ericks

下面是我如何创建它与图像的圈链接： jsfiddle

var paper = Raphael(document.getElementById("test"), 320, 200); 

var circle = paper.circle(100, 100, 50); 
circle.attr({ 
    fill: 'url(http://upload.wikimedia.org/wikipedia/commons/thumb/b/b6/SIPI_Jelly_Beans_4.1.07.tiff/lossy-page1-220px-SIPI_Jelly_Beans_4.1.07.tiff.jpg)' 
});

我离开了动画出来完全以保持其基本尽我所能。它似乎工作正常，并且与您的代码非常相似。如果您在示例中看不到它，那么可能是浏览器问题。

来源

2013-08-02 21:30:21

它没有为我工作。我不知道为什么。：/我也复制并粘贴你的代码，但没有成功。这很好奇吧？ Anw：我会用另一种方法。谢了哥们。 – Ericks

如何将图像放在与拉斐尔Js的圆圈内

回答

相关问题