HTML5-キャンバスに既にある画像を移動するにはどうすればいいですか

Question

先週Canvasで遊びたいと決めました。私は小児がいるシンプルなwebapp（私の娘の要求で）を作っています、そしてあなたは自分の写真にそれらを加えて、それらを動かすことができます。

私はすでにボタンが押されたとき、それはそう、ポニーの絵をキャンバス上に来ています。今

私の質問は、彼らがキャンバス上にすでにあるときに複数の画像を移動するための最良の方法は何ですか？

私は彼らに、それぞれをドラッグすることができればそれは素晴らしいことだが、私は唯一のKineticJSを使用してチュートリアルを見つけることができる、と私はそれが私が欲しいどのように表示することができません。

そうでは、キャンバスのチュートリアル上の他のドラッグイメージがそこにあるのですか？

それ以外の場合は、キーボードのボタンを使用して大丈夫だろうが、私は複数の画像でそれを行う方法を見つけ出すことはできません。キーボードボタンを使用すると、すべての画像が一度に移動します。

アイデア？

Answer 1

あなたは（おそらくプロセスでそれらのいくつかを移動）あなたはキャンバス全体をクリアし、それぞれを描き、それらの一つ一つを再描画場所を追跡する必要があります。

これはいずれもCanvasに組み込まれていません。私はmaking the Canvas interactiveのチュートリアルで、キャンバス上の図形の追跡、配置、移動（選択）をカバーしています。そのページにはライブデモがあり、記事の最後にはソースコードがあります。