在拉斐尔中将对象作为一个组旋转
Rotate objects as a group in Raphael
我是Raphael的新手,我正在尝试让两个圆在与画布中心相关的圆形轨道上移动。
在这里我做了省略号来说明这个情况。黑点是画布的中心。
http://jsfiddle.net/QCSb9/
我用set()对圆进行分组,但当试图旋转它们时,它们单独使用自己的中心进行旋转,我认为对这些圆进行分组时,组的新几何体会发生变化,变成黑点,即组的中心。
如何将这些圆作为一个对象连续旋转。
这是我正在使用的代码:
$().ready(function(){
var paper = Raphael("canvas", 640, 480);
paper.rect(0, 0, 640, 480, 10).attr({fill: "#fff", stroke: "none"});
paper.circle(320, 240, 1).attr({"fill":"#000000","stroke-width":0});
var circles = paper.set();
circles.push(
paper.ellipse(200, 240, 30, 25),
paper.ellipse(440, 240, 30, 25)
);
circles.attr({"fill":"#e00000","stroke-width":0});
var anim = Raphael.animation({"transform":"r360"},2000);
circles.animate(anim.repeat(Infinity));
});
已解决:问题是将旋转中心指定为"r360320240":
var anim = Raphael.animation({"transform":"r360,320,240"},2000);
rotate()被弃用,但解释了允许的参数:
http://raphaeljs.com/reference.html#Element.rotate
这里是jsfiddle.net 上更正的示例
http://jsfiddle.net/SW3sP/1/
相关文章:
- 禁用旋转木马中的下一个按钮和上一个按钮
- 在引导程序旋转木马中显示下一个图像
- 如何在猫头鹰旋转木马中滑动所有可见项目,而不是使用上一个/下一个按钮
- 在拉斐尔中将对象作为一个组旋转
- Jquery幻灯片中的列表,连接第一个和最后一个列表元素以创建旋转木马
- D3.js-围绕一个点旋转svg文本
- 如何停止多次单击下一个以破坏我的图像旋转器
- 在一组旋转器中,当一个旋转器的值发生变化时,更新其他旋转器的最大值
- 如何对齐一个旋转的轮子停止在中心位置,而不是使用javascript随机位置
- jQuery图库正在重复第一张图片的一个旋转
- 如何用CSS3和jQuery创建一个旋转齿轮
- js -制作一个旋转动画
- 使用javascript在HTML页面中构建一个旋转控件
- 在javascript中创建一个旋转函数
- 创建了一个旋转木马,但如果有多个旋转木马就会出错.(包括小提琴)
- 使引导旋转木马子弹滑动另一个旋转木马
- 在之前的画布上画一个旋转的圆
- 当我们进行ajax调用并等待响应并阻塞页面时显示一个旋转器
- Matter.js创建一个旋转平台
- 如何以及何时显示一个旋转器