13

現在、 Canvas2Imageを使用して HTML5 キャンバスのコンテンツを保存しています。ただし、Google Chrome では動作しないようです。この問題を回避する方法についてのアイデアは大歓迎です。:)

4

4 に答える 4

7

canvas.toDataURL()Chrome では正常に動作しているように見えるため、ライブラリの問題である可能性があります。ただし、「キャンバスを画像に変換」機能は機能しているようです。

于 2010-03-30T10:10:52.387 に答える
5

このコードを使用してください

<html>
<head>
<script src="base64.js" type="text/javascript"></script>
<script src="canvas2image.js" type="text/javascript"></script>
</head>
<body>
<input type="button" id="savecanvas" value="Save Image" onclick="savecanvasfile()"/>
</body>
</html>



<script>
function savecanvasfile(){
    var canvas = document.getElementById('canvas_name');
    var context = canvas.getContext('2d');
    var strDataURI = canvas.toDataURL();
    Canvas2Image.saveAsPNG(canvas);
}
</script>

これらの canvas2image.js と base64.js をダウンロードし、このコードの作業のためにローカル フォルダーに保存します。

これらは、サイト http://www.nihilogic.dk/labs/canvas2image/で入手できます。

于 2013-01-09T06:07:43.690 に答える
4 
var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");
var strDataURI = canvas.toDataURL("image/png;base64");
document.write('<img src="'+strDataURI+'"/>');
于 2010-09-26T22:54:46.467 に答える
2

はい、やった！=)

www.assembla.com/code/codetodiagram/subversion/nodes/experimental/canvasBox/default/CanvasBox.js?rev=239#ln1235をご覧ください。http://www.thiagomata.com/codetodiagram/svn/experimental/canvasBox/classDiagram/classDiagram.htmlで実行されていることがわかります。

画像をブラウザーに表示せず、1 つのダウンロードとして表示するには、次の単純な php ファイルを作成する必要があります: www.assembla.com/code/codetodiagram/subversion/nodes/experimental/canvasBox/default/download.php?rev= 23 9

ダウンロード開始後に about:blank ページを保持しないブラウザに close.html を作成する必要がありますwww.assembla.com/code/codetodiagram/subversion/nodes/experimental/canvasBox/default/close.html?rev=239

私はおそらく thiagomata.blog.com にそれについて大きな投稿をするでしょうが、私はこのファイルであなたがすでに道を見つけることができると思います.

おそらく、将来この投稿を読むと、thiagomata.com のリンクが切れる可能性があります。これは、このプロジェクトを codetodiagram.com に移行するためです。

それでおしまい！チアゴ・マタ

于 2010-08-13T21:39:01.077 に答える