1

我正在使用Kineticjs绘制栅格。这适用于 Kinetic.Rect。现在我想使用Kinetic.Rect以外的其他对象。在这个对象中，我应该能够保存光栅中位置的 x 和 y。我必须遵循以下代码：

function Tile(rasterX, rasterY, occupied, config) {
    Kinetic.Rect.call(this, config);
    this.rasterX = rasterX;
    this.rasterY = rasterY;
    this.occupied = occupied;
}

Tile.prototype = new Kinetic.Rect();

Tile.prototype.constructor = Tile;

现在我更改了创建的 Kinetic.Rect 的代码（这有效）：

var tile = new Kinetic.Rect({
                                width: drawWidth,
                                height: drawHeight,
                                stroke: 'black',
                                fill: 'grey',
                                x: x,
                                y: j * drawHeight
                            });

到：

var tile = new Tile(j, i, false, {
                            width: drawWidth,
                            height: drawHeight,
                            stroke: 'black',
                            fill: 'grey',
                            x: x,
                            y: j * drawHeight
                        });

不知何故，配置没有正确传递给 Kinetic.Rect 构造函数，因为创建的所有图块的 x 和 y 都是相同的（画布的右下角）。然而，颜色在那里。

4

2 回答 2

2

Here is how I extend Kinetic objects

MyCircle = function(config) {
        Kinetic.Circle.call(this, $.extend({
            x: 0,
            y: 0
        }, config));
};
MyCircle.prototype = {
        myFunc: function() {
        }
}
Kinetic.Global.extend(MyCircle, Kinetic.Circle);
于 2013-03-31T11:30:15.683 回答
1

嗯，是不是Kinetic.Rect构造函数逻辑改变了对象的某些部分，导致这种奇怪的行为？

尝试使用Tile.prototype = Object.create(Kinetic.Rect.prototype);for 继承。

The difference is that Object.create will return a new object with the specified prototype while the new operator when doing Tile.prototype = new Kinetic.Rect(); also sets up the prototype chain, but also runs the constructor logic wich might have undesireble side-effects.

于 2013-03-30T19:15:07.870 回答