HTMLキャンバス要素の内容から画像データを生成する最良の方法は何ですか？HTMLキャンバス要素から画像データを生成
イメージデータをサーバーに送信できるように作成したいと思います（ユーザーがファイルに直接保存する必要はありません）。画像データは、PNGやJPEGなどの共通の形式でなければなりません。
複数のブラウザで正しく動作するソリューションが推奨されますが、すべてのソリューションがブラウザに依存する場合は、最新のバージョンのFirefoxを対象にする必要があります。
あなたが使用できるlibはCanvas2Imageだと思います。キャンバスのネイティブ機能を使用していますが、どのブラウザでも動作しません。私はこのlibの最適化されたバージョンを持っています、あなたがしたい場合は、私はあなたとそれを共有します。
次に、生成されたData URIを取得し、Ajaxを使用してサーバーに送信することができます。
FirefoxとOperaには、データURL形式のPNGを返すtoDataURL()メソッドがあります。結果をフォームフィールドに割り当てて、サーバーに送信することができます。
データURLはベース64でエンコードされているため、サーバー側でデコードする必要があります。また、 "data：image/png;"を取り除く必要があります。もちろん。
ありがとうございます、私は必要なもののように聞こえます。私は最適化されたバージョンに感謝します。自分のプロフィールに記載されている私のウェブサイトを訪れて、自分のメールアドレスを見つけることができるはずです。 – Doug
問題ありません！ http://flotr.googlecode.com/svn/trunk/flotr/flotr/prototype/lib/canvas2image.js BMPレンダリングを変更してアルファチャンネルといくつかの速度を最適化しました。実際には、私が作業している無料の図書館で使っていたので、無料で、いつもそうです。 –
ありがとう、ずっと！私が企画しているプロジェクトは、ほとんどが個人的な利用のためにソースが自由に利用できるようになるでしょう。 – Doug