88

1 つのテーブルを含む html ページから pdf レポートを生成しています。

私は目的のためにwkhtmltopdfを使用しています。

pdf が生成されると、 tr tag のどこかで壊れます。

避けたい。

4

18 に答える 18

164

更新17.09.2015 : 使用しているバージョンを確認してください: wkhtmltopdf 0.12.2.4 は問題を修正すると言われています (私は確認していません)。

これは wkhtmltopdf の既知の問題です。Webkit で使用される改ページ アルゴリズム (WKhtmltopdf の WK) は、大きなテーブルではうまく機能しません。テーブルをより簡単にページに分割できる小さなチャンクに分割し、css を頻繁に使用することをお勧めします。

table, tr, td, th, tbody, thead, tfoot {
    page-break-inside: avoid !important;
}

次の wkhtmltopdf の問題も見てください。たとえば、テーブル分割の問題について議論する興味深いコメントがあります。プログラムでテーブルを 168 に分割する JS ソリューションが役立ちます (私は使用しません)。

更新 08.11.2013 これについては、上記のリンクの issue 168 で多くの議論があります。より優れたテーブル分割をサポートする wkhtmltopdf のバージョンをコンパイルすることに成功した人がいますが、残念ながら、それは正式にリリースされておらず、他のバグが含まれている可能性があります。入手方法も、Windows でのコンパイル方法もわかりませんが、興味のある方は、たとえばここのコメントを確認してください(以下の新しい更新を参照)。

更新 24.02.2014 wkhtmltopdf 0.12 では、この機能が大幅に改善されました。ただし、0.12.1 を待って、新しいバージョンを使用する前に徹底的にテストしてください。アンチアライズに取り組んでいる新しい人たちは素晴らしい仕事をしていますが、まだ少し不安定です (ashkulz rocks)! wkhtmltopdf.orgとgithubで最新情報を入手してください。Google コード サイトは廃止され、ゆっくりと移行されています。

于 2012-11-23T09:01:26.887 に答える
19

0.12 以降、この問題は解決されましたが、表が長すぎてページに収まらない場合、wkhtmltopdf が表を 2 つの部分に分割し、新しいページで列ヘッダーを繰り返し、これらの列ヘッダーが最初の行に重ねて表示されることがあります。

wkhtmltopdf githubの問題セクションで、この問題の一時的な解決策を見つけました: https://github.com/wkhtmltopdf/wkhtmltopdf/issues/2531

次の行をビュー CSS に追加するだけです。

tr {
  page-break-inside: avoid; 
}
于 2015-09-15T12:25:05.657 に答える
4

テーブルに対してあらゆる操作を試みましたが、改ページが行の途中に挿入されるのを止めることはできませんでした。必死になってさまざまなバージョンを試したところ、次のことがわかりました。

Wkhtmltopdf 0.12.2.1: 悪い

Wkhtmltopdf 0.12.3: 悪い

Wkhtmltopdf 0.12.1: 良い

私の解決策は、問題を解決したバージョン 0.12.1 にダウングレードすることでした。確かに、一部には、私の html があまり OCD ではないことが原因である可能性がありますが、HTML は TinyMCE 内で (ユーザーによって) 生成されるため、選択の余地はあまりありません。

また、ネストされたテーブルは、どのバージョンでも機能しません。

于 2016-08-12T06:57:30.307 に答える
1

まだこれに問題がある人は、覚えておくべきことの1つは、テーブルがbodyの直接の子でなければならないということです。

于 2015-11-20T19:57:00.973 に答える
1

上記の答えは私にはうまくいきませんでした。私のpdfkit構成でズームオプションを具体的に無効にする必要がありました。

PDFKit.configure do |config|

  config.default_options = {
    print_media_type: false,
    page_size: "A4",
    encoding: "UTF-8",
    ## Make sure the zoom option is not enabled!
    ## zoom: '1.3',
    disable_smart_shrinking: false,
    footer_right: "Page [page] of [toPage]"
  }

end
于 2013-08-18T22:09:58.997 に答える
1

別のオプション: それぞれtrを独自tbodyに配置してから、peage break css ルールをtbody. テーブルは複数tbodyの をサポートします。

少し余分なマークアップがありますが、私にとってはうまく機能します。

于 2016-06-22T21:42:37.173 に答える
1

私はこのばかげた解決策を見つけましたが、私にとっては非常にうまくいきました:)

このような非常に長いrowspan列を配置しました

<td rowspan="XXX TOTAL ROWS" style="width:0px"></td>

そして、テーブルは壊れません。

于 2016-06-22T03:37:45.863 に答える
1

最新のh4cc/wkhtmltopdf-amd64 バージョン 0.12.4を使用して、この問題にかなり苦労しましたが、最終的にパッケージのバージョンを0.12.3!

于 2018-09-04T12:24:41.707 に答える
0

テーブルヘッドはありますか？とテーブル本体？

<table>
<tbody>
<tr><th>Name</th><th>Value</th></tr>
<tr><td>url</td><td>stackoverflow.com</td></tr>
<tr><td>ip</td><td>123.123.123.123</td></tr>
</tbody>
</table>

これはテーブルの適切なフォーマットですが、ほとんどのブラウザーはそれほど気にすることはできませんが、あなたが言及したようなコンバーター<tbody>は、不足しているタグや<th>タグがない場合は、最初にそれらを追加してみることをお勧めします。

于 2012-11-22T16:17:42.677 に答える