如何在Raphael js中获得完整的图像

Question

I am able to fill the image inside the circle. But the problem is image getting zoomed inside the circle, i want image to be less zoomed or fit into circle.

<div class="disp"></div>

JavaScript

  var r = Raphael("disp");

  var cir=r.circle(100, 100,33).attr({fill:"url(image.jpg)"});
// image get zoomed, how to make image fit into circle or less zoomed

Please help me! Thanks

Answer 1

You will need to do some mathematics. Don't use attr(fill) - create an image -object and fit it in your circle.
Here is a great example of such behaviour.

BTW, you wrote class ="disp" and var r = Raphael("disp"); won't work - this function waits for id .

Answer 2

Here's a solution you can put directly into your code, assuming you're using jQuery as well as Raphael