問題描述
Raphaël.js:如何縮放圓形的填充圖像以適合圓形? (Raphaël.js: How to scale a circle's fill image to fit the circle?)
I'm trying to use Raphael's VML functionality for generating a circle with an image (fix for IE8 that lacks border‑radius).
My problem is that if I use
circle.attr({fill: 'url(image.jpg)'});
and my image is larger than the circle the image is only partially showed and I can't find a way to downscale the image to the diameter of the circle.
How can I do this?
‑‑‑‑‑
參考解法
方法 1:
Are you serious about fixing IE8 border‑radius with RaphaelJS? I would suggest something like css3pie and there is even question in SO about usage.
But still, if you want to use RaphaelJS, you will need to use Element.transform to scale your image and only afterwards, set up rounded corners effect with another element.