拉斐尔绘画.带有来自不同图像的两个扇区的圆圈 [英] Raphael drawing. Circle with two sectors from different images

问题描述

如何绘制由图像填充的圆圈以及如何绘制该圆圈的扇区?是否可以动画绘图扇区(例如通过增加动画它的大小角度)?如果我想从@image1@ 和另一个绘制第一个扇区怎么办来自@image2@的扇区?

How to draw circle filled by image and how to draw the sector of such circle? Is it possible to animate drawing sector (for example animate it's size by increasing angle)? What if I want to draw first sector from @image1@ and another sector from @image2@?

推荐答案

要绘制一个由图像填充的圆圈，您...只需绘制圆圈并用图像填充它 :D

To draw a circle filled by image you... simply draw the circle and fill it with an image :D

var c = paper.circle(200, 200, 40);
c.attr({fill:"url(http://path_to_the_image.png)"});

关于绘制一个扇区，我认为您实际上必须绘制一个路径，然后像圆圈一样填充它.使用这种技术，您还解决了具有不同图像填充的 2 个扇区的问题:)

About drawing a sector I think that you actually have to draw a path and then fill it the same way like the circle. Using this technique you also solved the probelm of 2 sectors with different image fills :)

要为弧设置动画，请查看 raphalejs 网站上的此示例

To animate the arc take a look at this example on raphalejs website

这篇关于拉斐尔绘画.带有来自不同图像的两个扇区的圆圈的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！