キャンバスHTML5に背景画像を設定することは可能ですか？取り消し、消去、消去などのいくつかのペイント機能を実行できますか、その背景画像を保存しますか？

Question

キャンバスHTML5について知りたい。 私のベースキャンバス要素で私は背景画像を設定したい、その上で私はペイントのようないくつかの機能を実行したいと思います。取り消し、元に戻す、クリアし、その効果の画像を保存します（すべての効果を元に戻してクリアを適用した後）。

Answer 1

最も簡単で最高のパフォーマンスは、その背景をキャンバスの背後に置くことです。

Answer 2

drawImage（）を使用して、背景をキャンバスに描画することができます。さらにすべての操作は画像の上に描かれます。

作業を終えたら、Canvasstateをイメージにエクスポートできます。

しかし、キャンバスは直接修正されるため、すべてのタスクの履歴を保持する必要があります。

保存と復元の方法が役立つ場合があります。

最初にキャンバスにイメージを描画することが重要です。他のすべてのエフェクトがイメージに影響します。

Answer 3

history APIは、取り消しとやり直しに使用できます。

CanvasオブジェクトのtoDataURLメソッドを使用してイメージを保存できます。