スプライトを含むグループで表されるユニットを移動するコードを KineticJS で記述しようとしています (グラフィカルな表現にさらに多くのものを追加したい場合があるため、グループです)。
移動関数のコードは次のとおりです。
this.moveTo = function(x,y) {
distance = Math.sqrt((this.shape.getX() - x)*(this.shape.getX() - x)+(this.shape.getY() - y)*(this.shape.getY() - y));
time = distance / MOVEMENT_SPEED;
var sprite = this.sprite;
this.sprite.setAnimation('walkDown'); //TODO: change
this.group.transitionTo({
x: x,
y: y,
duration: time,
easing: "ease-in-out",
callback: function(){
sprite.setAnimation('idle');
}
})
}
行がなければ、sprite.setAnimation('idle');
すべてがうまく機能します。この行を使用すると、ほとんどの場合、すべてが期待どおりに機能します (つまり、動きが終了するとアニメーションが停止します) が、スプライトが完全に消えて、次の不可解なエラー メッセージが表示されることがあります。
エラー: d is undefined" が kinetic-v3.9.8.min.js の 29 行目にある
テストの目的で、今のところ moveTo は画面上でマウスをクリックすることによって呼び出されます。前の動きが終わる前にマウスをクリックしてしまったことが関係しているのではないかと思っていたのですが、気をつけていてもたまにエラーが発生してしまいます。
編集: ほとんどの場合、ステージの端近くをクリックし、移動命令がユニットを「アウト」するように命令すると、エラーが発生します。それでも、スプライトのアニメーションを変更して接続を理解しない限り、悪いことは何も起こりません。また、国境の近くをクリックせずにエラーを再現することができましたが、それはまれです。