Jquery 分别围绕圆旋转组

我有几个较小的圆，目前围绕一个较大的圆旋转。问题是，它们都一起旋转

我想知道是否有人能帮我做这件事，这样我就可以在小组的基础上轮换个人了。我一辈子都想不出来

这是JSFiddle:

以下是jQuery：

jQuery(function($){

!jQuery.easing && (jQuery.easing = {});
!jQuery.easing.easeOutQuad && (jQuery.easing.easeOutQuad = function( p ) { return 1 - Math.pow( 1 - p, 2 ); });

var circleController = {
create: function( circle ){
  var obj = {
    angle: circle.data('angle'),
    element: circle,
    measure: $('<div />').css('width', 360 * 8 + parseFloat(circle.data('angle'))),
    update: circleController.update,
    reposition: circleController.reposition,
  };
  obj.reposition();
  return obj;
},
update: function( angle ){
  this.angle = angle;
  this.reposition();
},
reposition: function(){
  var radians = this.angle * Math.PI / 180, radius = 600 / 2;
  this.element.css({
    marginLeft: (Math.sin( radians ) * radius - 50) + 'px',
    marginTop: (Math.cos( radians ) * radius - 50) + 'px'
  });
}
};

var spin = {
circles: [],
left: function(){
  var self = this;
  $.each(this.circles, function(i, circle){
    circle.measure.stop(true, false).animate(
      { 'width': '-=45' },
      {
        easing: 'easeOutQuad',
        duration: 1000,
        step: function( now ){ circle.update( now ); }
      }
    );
  });
 },
right: function(){
  var self = this;
  $.each(this.circles, function(i, circle){
    circle.measure.stop(true, false).animate(
      { 'width': '+=45' },
      {
        easing: 'easeOutQuad',
        duration: 1000,
        step: function( now ){ circle.update( now ); }
      }
    );
  });
 },
prep: function( circles ){
  for ( var i=0, circle; i<circles.length; i++ ) {
    this.circles.push(circleController.create($(circles[i])));
  }
}
};

 var dataGroup;  

 $('#goL').click(function(){ spin.left() });
 $('#goR').click(function(){ spin.right() });

 $('#goLMovies').click(function(){ 

  dataGroup = "movies";
  spin.left(dataGroup) 
 });

$('#goLSomething').click(function(){ 

  dataGroup = "something";
  spin.left(dataGroup) 
 });

$('#goLAnimation').click(function(){ 

  dataGroup = "animation";
  spin.left(dataGroup) 
 });

spin.prep($('.circle'));

});

jQuery（函数（$）{
！jQuery.easing&&（jQuery.easing={}）；
！jQuery.easing.easeOutQuad&&（jQuery.easing.easeOutQuad=function（p）{return 1-Math.pow（1-p，2）；}）；
var circleController={
创建：函数（圆）{
var obj={
角度：圆。数据（“角度”），
元素：圆圈，
度量：$（''）.css（'width'，360*8+parseFloat（circle.data（'angle'）），
更新：circleController.update，
重新定位：circleController.Resposition，
};
对象重新定位（）；
返回obj；
},
更新：功能（角度）{
这个角度=角度；
这个。重新定位（）；
},
重新定位：函数（）{
var弧度=this.angle*Math.PI/180，半径=600/2；
this.element.css({
边缘左：（数学sin（弧度）*半径-50）+“px”，
玛金托普：（数学cos（弧度）*半径-50）+“px”
});
}
};
变量自旋={
圆圈：[]，
左：函数（）{
var self=这个；
$.each（this.circles，function（i，circle）{
圆。测量。停止（真，假）。设置动画(
{'width'：'-=45'}，
{
放松：“easeOutQuad”，
持续时间：1000，
步骤：函数（现在）{circle.update（现在）；}
}
);
});
},
右：函数（）{
var self=这个；
$.each（this.circles，function（i，circle）{
圆。测量。停止（真，假）。设置动画(
{'width'：'+=45'}，
{
放松：“easeOutQuad”，
持续时间：1000，
步骤：函数（现在）{circle.update（现在）；}
}
);
});
},
准备：功能（圆）{
对于（var i=0，circle；i如果您想使用类似于此spin.left（数据组）的spin.left函数来仅影响具有该数据组的圆，则需要在函数中添加if，并将circle.element.data（“组”）与类似的数据组进行比较

var dataGroup;  
$('#goL').click(function(){ spin.left() });//spin.left all circles 
$('#goLMovies').click(function(){ 
  dataGroup = "movies";
  spin.left(dataGroup);//spin.left only movies
});    
var spin = {
    circles: [],
    left: function(group){
        var self = this;
        $.each(this.circles, function(i, circle){
            //if the circle.element data group is equal to "movies" 
            //or the dataGroup is equal to ""==all circles
            if(circle.element.data("group")==group||group==""){
                circle.measure.stop(true, false).animate(
                  { 'width': '-=45' },
                  {
                    easing: 'easeOutQuad',
                    duration: 1000,
                    step: function( now ){ circle.update( now ); }
                  }
                );
            }          
        });
    }
...
}    

太棒了，这很好用。除了“某物”组之外，这不起作用，因为你在链接上的id像是高尔夫而不是高尔夫，从来没有注意到。今天眼睛很累。非常感谢你帮助我。非常感谢。