問題タブ [todataurl]

Web プロジェクトの場合、キャンバスから取得した画像をメールで dataURL 経由で送信して、タンブラーに直接アップロードしたいと考えています。dataURL を取得して、画像をダウンロードできます

この画像をメールで直接送信する方法はありますか?

私のキャンバスには、ローカルファイルまたはインターネットからの画像からプログラムで生成された画像があります。toDataURl 関数を使用して保存しようとすると、安全なエラーが発生します。結果を保存するにはどうすればよいですか (サーバーなしで js のみを使用)、それは可能ですか?

セキュリティルールについては知っていますが、このルールをバイパスする解決策があるかもしれません

必要に応じて、私のコードはすべてgithubにあります

テーブルをキャンバスに描画し、キャンバスを画像として保存したい。（pdfを作成する必要があります）

面白いことに、テーブルはキャンバスに表示されますが、.toDataURL で変換できず、空白の画像が返されるだけです。

コンソールにアラートはありません。

私はアイデアがありません。すべての洞察が高く評価されています。

私は使用してスクリーンショットを撮っているhtml5ビデオを持っています:

これにより、キャンバスにスクリーンショットがうまく描画されます。ただし、私がやろうとしているのは、複数のキャンバスで複数のスクリーンショットを撮り、 Resemble.jsを使用してそれらを比較することです。

Resemble.js には 2 つのファイルが必要です。キャンバスからこれらのファイルを取得するために toDataURL() を使用しようとしています。

そして、画像を次のようにプラグインします。

これが私にとって失敗しているように見えるのは toDataURL() です。キャンバスからは何も生成されません。この問題の原因は何ですか? そして、私は自分のアプローチで正しい軌道に乗っていますか?

drawImage() 関数を使用しない限り、キャンバスを png ファイルとしてダウンロードできます。toDataURL() は、セキュリティ上の問題から外部画像を許可していないことを知っています。しかし、同じサーバーでホストされているローカル イメージを使用しても、まだ機能しません。残念ながら、私が見つけた解決策はどれもうまくいきませんでした。

私の問題は、KineticJS のバージョン 5 で始まりましたが、それ以前は問題ではありませんでした。正方形や円などのネイティブの KineticJS 形状は、stage.toDataURL 関数を使用して画像ファイルに保存できます。ただし、beginPath() などの通常のキャンバス メソッドで描画された非キネティック シェイプでは機能しません。および canvas.fill(); (バージョン 4 はこれで問題ありませんでした)。次のコードは、赤と青の 2 つの四角形を描画します。赤はカスタム、青はネイティブのキネティック レクタングルです。

両方の形状が表示されますが、toDataURL 関数によって生成された画像には青い四角形のみが表示されます。描画方法が KineticJS 5 で変更され、fillStyle などの属性を設定するようになったので、それが関係しているのではないかと考えています。ステージ...

Chart.jsで 2 つ以上のリンクされた Canvas-Charts を処理するには? このスクリプトを使用すると、キャンバス イメージがより大きなバージョンにリンクされて、大きなファイルがファンシー ボックスに表示されるか、2 つだけダウンロードされます (右クリック -> 保存)。簡単。

Chart.jsでtoDataURL()を使用するには少し注意が必要です。これは、アニメーションが終了する前ではなくチャート全体をレンダリングするためです。URL を要求するのが早すぎると、空の (透明な) 画像が表示されます。そのため、オプションにonAnimationCompleteが必要です。

スクリプトの後半で、アニメーションが終了すると、新しい HREF が起動/変更されます。

それはうまくいきます。ただし、canvas-imageは1 つだけです。2 番目の関数 done()を削除すると、1 番目のキャンバスで機能します。1 番目の関数を削除すると、2 番目のキャンバスだけが URL を表示します。

問題は「完了」にあると思います。それは名前ではなく、状況のようなものですか? 「var options」はすべてのキャンバス画像に一般的です（確かに、options1とoptions2、および「Line（lineChartData1、options1）」にも変更できますが、変更はありません）...「done」はすべての関数を起動しますそして - それは悪い - どうやら最後の機能だけです。

反対側では、onAnimationCompleteのエントリの名前を変更できません。それはnullまたは完了であり、他には何もありません。何をすべきか？

写真、テキスト、地図をキャンバスにロードできる Fabric.js プロトタイプがあります。完成したら、キャンバスを画像として保存できるようにしてほしいです。私は標準を使用してみました：

しかし、キャンバスはtainted-画像のせいだと思います（上記の方法は、テキストだけの場合に機能します）。エラーは次のとおりです。

Fabric の組み込みメソッドを使用して、SVG として保存できます。

しかし、私はむしろPNG / JPGが欲しいです。何か案は？

キャンバスのシリアル化に関する Fabric.js のドキュメントを次に示します。

http://fabricjs.com/fabric-intro-part-3/#serialization

キャンバスから画像を作成したいのですが、kineticjs を使用していますが、次のエラーが表示されます。クロスオリジンエラーが原因だと思います。キャンバスでは、ローカルに保存された画像を使用し、アドレス パスは「file://..」で始まります。Apacheをインストールせずにイメージを作成する方法はありますか? ありがとう。

この関数が変数 dataURL_ に対して null を返す理由を誰でも説明できますか