在dynamicjs中旋转具有偏移的图层或图像

Question

我有一个dynamicjs应用程序，其中包括以下内容

1. 动力学阶段
2. 一个backgroundLayer一层dynamicjs层，
3. 一个backgroundImage一个动力学的​​js图像

我的舞台已固定大小800x600

//global variables
var stageWidth = 800;
var stageHeight = 600;

stage = new Kinetic.Stage({
    width: stageWidth,
    height:stageHeight,
    container: 'container',
    x: 0,
    y: 0
});

我的backgroundLayer大小也固定，处于舞台顶部

backgroundLayer = new Kinetic.Layer({
    width:stageWidth,
    height: stageHeight,
    x: 0,
    y: 0,
    draggable: false,
    offset: [stageWidth / 2, stageHeight / 2]

});

我的Kineticjs图像的大小取决于图像的大小。 因此，如果图像是垂直的，则其高度为600，并根据舞台尺寸的比例调整宽度。 当图像为纵向时，其操作方式相同

function initializeImage(id){
    var domImage = $("#"+id);
    var imageSrc = domImage.prop('src');
    imageObj = new Image();
    imageObj.src = imageSrc;
    if (imageWidth > imageHeight){
        imageWidth = stageWidth;
        imageHeight = imageWidth / ratio;
        imageY = (stageHeight - imageHeight) / 2;
    }else{
        imageHeight = stageHeight;
        imageWidth = stageHeight / ratio;
        imageX = (stageWidth - imageWidth) / 2;

    }
    domImage.remove();

}

然后我按如下方式初始化the kinetijs图像对象

imageObj.onload = function (){
    backgroundImage = new Kinetic.Image({
        image:imageObj,
        width:imageWidth,
        height:imageHeight,
        x:imageX,
        y:imageY

    });

然后按以下顺序添加它们

backgroundLayer.add(backgroundImage);        
stage.add(backgroundLayer);

我的问题是，当我尝试旋转Image或使用offset旋转的Layer无法工作时。 我遇到以下问题

1. 即使我在创建时将其设置为与众不同，background.offset（）仍返回{x：0，y：0}
2. 我在图层上手动设置偏移量，然后旋转10度，而不会在图层中心旋转。 而是将图层淹没到左上角，并且图像消失。

我的代码有问题吗？我是否理解不正确？

Answer 1

看起来您需要更改API（必须传递对象，而不是数组）：

offset: {
  x : stageWidth / 2,
  y : stageHeight / 2
}