在kinetic.js与旋转kinetic.group问题(In kinetic.js Issue

我使用动态JS。 我加入图像，线条等的kinetic.group并试图转动组，在得到正确的旋转。 但旋转组，如果我尝试画一条线没有正确对本鼠标位置绘制后。 这是借鉴，因为它是转动前。

该问题可能是，如果我旋转组，舞台坐标没有得到旋转看来。 我应该怎么做才能避免这种情况？

参考代码 - -

var rootGroup = new Kinetic.Group({
                    x:  stage.getWidth()/3, 
                    y:  stage.getWidth()/6, 
                    draggable: true,
                    offset: [images.darthVader.width/2, images.darthVader.height/2]
                });
rootGroup.add(line);
rootGroup.setRotationDeg(rootGroup.getRotationDeg()+90);

在这方面，我都会画线。

 var activeline = new Kinetic.Line({
   points: [{x:0,y:0}],
   stroke: "blue",
   strokeWidth: 3,
   lineCap: "round",
   lineJoin: "round",
 });
 var mousePos = stage.getMousePosition();

 points.push({
            x: mousePos.x,
            y: mousePos.y
 });

 activeline.setPoints(points);
 rootGroup.add(activeline);

Answer 1:

我不熟悉KineticJS，但似乎你必须变换矩阵重置为默认状态。 OpenGL的具有glLoadIdentity（）方法。 搜索在KineticJS一个类似的方法。

请参见本教程http://www.html5canvastutorials.com/advanced/html5-canvas-reset-transform-tutorial/

Answer 2:

这应该让你相当接近： http://jsfiddle.net/k4qB8/24/

 // This rotates that added active line along with your group.
 // This makes the draw direction correct
 activeline.setRotationDeg(0-rootGroup.getRotationDeg());

文章来源: In kinetic.js Issue with rotating a kinetic.group