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
                        });

作成されたすべてのタイルの x と y が同じであるため、構成が Kinetic.Rect コンストラクターに正しく渡されません (キャンバスの右下隅)。しかし、色はそこにあります。

4

2 に答える 2

2

キネティックオブジェクトを拡張する方法は次のとおりです

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 inheritingを使用してみてください。

違いはObject.create、指定されたプロトタイプを持つ新しいオブジェクトを返す一方で、newオペレーターTile.prototype = new Kinetic.Rect();がプロトタイプ チェーンをセットアップするときにも、望ましくない副作用をもたらす可能性のあるコンストラクター ロジックも実行することです。

于 2013-03-30T19:15:07.870 に答える