在createJS / easelJS中围绕另一个旋转一个对象

Question

在画架中，围绕另一个物体旋转物体的最佳方法是什么？我想要完成的是一种旋转十字线的方法，如下图所示，就像一颗行星绕太阳运行一样：

我已经能够围绕自己的中心点旋转物体了，但我很难设计一种方法来围绕第二个物体的中心点旋转一个物体。有什么想法吗？

Answer 1

可能有意义地将内容包装在Container中。翻译坐标，使中心点位于您想要的位置，然后旋转容器。

Answer 2

要建立Lanny的建议，可能会出现您不想旋转整个容器的情况。另一种方法是使用三角函数和递增角来计算十字准线的x / y位置。您可以使用角度（转换为弧度）找到x / y，使用Math.cos(angleInRadians)表示x，Math.sin(angleInRadians)表示y，乘以轨道半径。

请参阅此working example以供参考。

这是一个完整的代码段。

var stage = new createjs.Stage("stage");
var angle = 0;

var circle = new createjs.Shape();
circle.graphics.beginFill("#FF0000").drawEllipse(-25, -25, 50, 50).endFill();
circle.x = 100;
circle.y = 100;

var crosshair = new createjs.Shape();
crosshair.graphics.setStrokeStyle(2).beginStroke("#FF0000").moveTo(5, 0).lineTo(5, 10).moveTo(0, 5).lineTo(10, 5).endStroke();

stage.addChild(circle);
stage.addChild(crosshair);

createjs.Ticker.addEventListener("tick", function(){

  angle++;
  if(angle > 360)
    angle = 1;

    var rads = angle * Math.PI / 180;
    var x = 100 * Math.cos(rads);
    var y = 100 * Math.sin(rads);
    crosshair.x = x + 100;
    crosshair.y = y + 100;

    stage.update();
});

Answer 3

以相同方向相对于原点放置另一个点

var one_meter = 1 / map_resolution;

// get one meter distance from pointed points
var extra_x = one_meter * Math.cos(temp_rotation);
var extra_y = one_meter * Math.sin(-temp_rotation);

var new_x = mapXY.x + extra_x;
var new_y = mapXY.y + extra_y;

var home_point = new createjs.Shape().set({ x: new_x, y: new_y });
home_point.graphics.beginFill("Blue").drawCircle(0, 0, 10);

stage.addChild(home_point);
stage.update();

enter image description here

enter image description here