4

D3 と wicked_pdf を使用していくつかのグラフをレンダリングしようとしています。show_as_html フラグを有効にすると、グラフが正常に表示されます。しかし、PDF 自体をレンダリングすると、軸だけが表示されます。グラフ エリア自体は空白です。グラフ コンテンツの後に軸がレンダリングされるため、JavaScript が実行されることはわかっています。 実際のチャート レンダリングされたグラフ canvgを使ってSVGをキャンバスオブジェクトに変換してみました。

canvg($(this).find('#canvas')[0], $('<div>').append($(picture).clone()).html(), { ignoreMouse: true, ignoreAnimation: true })

変化なし。次に、次を使用して SVG を PNG 画像に変換しました。

$(this).find('#chart').append("<img id='as' src='" + $(this).find('#canvas')[0].toDataURL() + "'>").show()

まだ変化なし。ただし、 を使用して同様の png 画像を静的画像としてドキュメントに挿入するとwicked_pdf_image_tag、正しい画像がレンダリングされます。wicked_pdf で画像を正しくレンダリングするにはどうすればよいですか? チャートが適切にレンダリングされる限り、形式は気にしません。

4

3 に答える 3

1

残念ながら、wicked_pdf は wkhtmltopdf を使用するため、@TheMcMurder の回答は役に立ちません。さらに、これは実際には wicked_pdf ではなく wkhtmltopdf の問題です。Chart.js(要素を使用)で同じ問題に取り組んでいます。

この問題に関する Whhtmltopdf Google グループの 2 つのスレッドへのリンクは次のとおりです。

そして、Githubで同じ問題が発生する可能性があることを議論するスレッドがあります

いくつかの基本的な検索では、可能性のある代替手段としてphantom.jsが指摘されていますが、まだ試していません。

私の担当者が低すぎるため、リンクを投稿できませんが、Google が対応してくれます

頑張ってください。進展があればお知らせください。

于 2015-01-20T17:48:06.417 に答える
0

私は同じ問題を抱えていました。ローカルホストの設定では、私にとっての解決策は、完全な Web ページを html に保存することでした (マウス メニュー ボタンとページを完全な Web ページとして保存します)。次に実行します。

wkhtmltopdf -O Landscape -s A3 saved-page.html output.pdf 

--javascript-delay 10000 も追加する必要があるかもしれませんが、必要ないかもしれません。

変ですが、svgのd3.jsチャートはこのようにレンダリングされていますが、URLを配置するとレンダリングされません...

于 2020-05-07T17:38:06.883 に答える