問題タブ [canvg]

div のスナップショットを取得する必要があります。私はhtml2canvasを使用しましたが、問題なく動作しました。しかし、SVG を同じ div に追加すると、svg は無視されます。

drawImage() も試しましたが、どちらも機能しませんでした。

clone() はこれを行うことができましたが、機能しなかったことを読みました。

drawImage():

クローン（）：

html2canvas:

テキスト、svg、画像を含む DIV をキャプチャするにはどうすればよいですか?

あなたの助けに感謝。

これが私の（切り捨てられた）SVG画像の例です（Highchartsで作成されたhttp://www.highcharts.com/）-それをキャンバスにレンダリングすると（canvgを使用して（https://github.com/gabelerner/canvgおよびコードが適応されます）ここから: https://stackoverflow.com/a/8997520/2067690 ) 結果の PNG のすべてのテキストが複製されます。 1回だけ登場？

SVG をキャンバスに変換して png を取得しようとしています。CSSの配置を除いて、すべてがうまく機能しています。

この jsfiddleを見てください

SVG である上部セクションが表示されます。

キャンバス要素にsvgをレンダリングするためにcanvgを使用しています。

2 つの svg が互いに重なっており、1 つは 100% のサイズで、もう 1 つは 80% のサイズです。これらをラファエルでレンダリングしています。

次のようなさまざまな場所で提案されているように、インラインスタイルを挿入しようとしました:

ただし、canvg のみが返されます。

キャンバスを SVG と同一にする必要があります。

*100% のサイズに変更し、円の半径を変更することはオプションではありません。これは図として非常に単純化されたバージョンです。

Canvg を使用して SVG を Canvas に変換しようとしています。ここにjsfiddleがあります。「エラー: 要素 'parsererror' はまだ実装されていません」というエラーが表示されます。canvg ライブラリが SVG 要素を解析できないことは理解できます。しかし、この問題の解決策はありますか? svg 要素からキャンバス要素を作成する必要があります。

PS : svg 要素は C3.js (D3.js ベースの再利用可能なライブラリ) によって作成されます。

SVG のレンダリングについて、HTML5 キャンバスに SVG ファイルを描画するトピックを見つけました。特定の時点で SVG アニメーション ファイルを描画する方法はありますか? つまり、コードを変更する方法

img特定の時間にsvgを含むような？ファイル myfile.svg には次のものが含まれます。

人々は通常、canvg を使用することを提案しますが、私が理解している限り、それはパス アニメーションをサポートしていないため、私の例では機能しません。

three.js の r71 と canvg ライブラリを使用しています。canvg を使用して SVG を表示していますが、次のエラーが発生します。

リソースの読み込みに失敗しました: サーバーは 404 (見つかりません) のステータスで応答しました

問題のコードは次のとおりです。

だから、cssを使ったhtml2canvasの悪い仕事について知っています。誰かが私が最善の解決策を見つけるのを手伝ってくれるかもしれません。要素を含むマップのスクリーンショットを作成する必要があります。スクリーンショットの後、私は画像を取得しますが、かなり見栄えがしますが、html ではマップのすべての要素 (パネル、ボタン) が失われ、すべての css クラスと画像が表示されません。

だから、私がしようとしていたこと: js/jquery; でマップの div をリロードします。スタイルシートをリロードします。css クラスを「myFile.css」から html に移動します。

私はそれが私にとって役に立たないと思います。

cssText を要素のスタイル属性に移動しようとすると、うまくいきましたが、div と彼の子供の悪い考えからすべての要素を取得して書き直すと思います。

にcanvg()変換する関数を使用svgしてcanvasいます。canvg()onload で直接使用すると、すべてが に変換svgされcanvasます。svg特定の に関連して変換したかったdiv。

HTML

脚本

ここでは、 which が を持っていることにsvg関連して変換する必要があります。divid=apply

フィドルのデモはこちら