2つのイメージを調整してキャンバスを保存します

Question

データベースから2つまたは3つのイメージでキャンバスを読み込もうとしています。

私はので、私はそう.... http://www.html5canvastutorials.com/labs/html5-canvas-drag-and-drop-resize-and-invert-images/

のように画像やサイズ直し、それらを移動することができますが、今、私はときにとてもキャンバスの下で（画像を保存）ボタンを持ちたいwoulod取り組んページを持っていますキャンバス上でイメージを調整してキャンバスを1つのjpgとして保存することができます

上にリンクされたコードでキャンバスを保存したり、イメージボタンを保存することは可能ですか？ 私は見ましたが、このシンプルなものは何も見つかりません。

私は

おかげ画像はキャンバスの機能の一つであり、非常に簡単であるよう

Answer 1

はキャンバスを保存する上記の例であるだけで正確に何をどんな派手な画像編集アプリは必要ありません。 これを実装するには、単純なイベントハンドラまたはフォーム送信ハンドラをjavascriptで使用できます。 jQueryを使用してキャンバスを取得し、キャンバスコンテンツのPNGにリダイレクトするコードサンプルを示します。キー機能はtoDataURL（）です。続きを読むhttp://www.w3.org/TR/html5/the-canvas-element.html#dom-canvas-todataurlここでそれについて

canvas = $("#maincanvas").get(0); 

.. your drawing operations here ... 

// The save image button event handler 
var toPNG = function() { 
    return window.location = canvas.toDataURL('image/png'); 
}; 
$('button#save').click(toPNG); 

それは、彼が「メインキャンバス」...