Wkhtmltopdfを使用してHTMLからPDFレポートを作成していますが、次のパターンに従うカスタムレポートを作成する必要があります。
これらすべてをまとめることでうまくいきます。ただし、ステップ3の情報はテーブルの直後に表示されるため、コンテンツをページの最後に配置する方法はありますか?
このソリューションがCSSベースなのかwkhtmltopdfベースなのかさえわかりません。
http://madalgo.au.dk/~jakobt/wkhtmltoxdoc/wkhtmltopdf-0.9.9-doc.html
「フッターとヘッダー」セクションをご覧ください。
これを行うには、--footer-html
をJavaScriptと組み合わせて使用できます。
wkhtmltopdf --footer-html footer.html http://www.stackoverflow.com/ so.pdf
footer.html
の内容は、上記のリンクにある例に基づいています。
<!DOCTYPE html>
<script>
window.onload = function() {
var vars = {};
var x = document.location.search.substring(1).split('&');
for (var i in x) {
var z = x[i].split('=', 2);
vars[z[0]] = unescape(z[1]);
}
//if current page number == last page number
if (vars['page'] == vars['topage']) {
document.querySelectorAll('.extra')[0].textContent = 'extra text here';
}
};
</script>
<style>
.extra {
color: red;
}
</style>
<div class="extra"></div>
これは非常に難しい作業であり、現時点では純粋なCSSでこれを解決できるとは思いません(間違っていることが証明されることを望んでいますが)。
また、決定された改ページのサポート(page-break-inside: avoid;
)は最高ではありません。実際、今のところテーブルでは機能しないと思います。おそらく、ページブレーキの周りでいくつかの行が分割されることになります。 (Webkitは1つをレンダリングしますPDFそしてそれを単一のページにカットします。ほとんどの場合、Edgeの内容に関係なく...)
このジレンマに対する私の解決策は、単一のページのサイズで単一のプレースホルダーdiv
sを作成し、PDFを生成する前に、これらのプレースホルダー間でプログラミング言語を使用してコンテンツを配布することでした。
このようなラッパーの最後では、下部に絶対位置のフッターを追加できます。
サンプルコードは次のとおりです。
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Sample Data</title>
<style>
* {
padding: 0;
margin: 0;
}
.page {
page-break-inside: avoid;
height: 1360px;
position: relative;
}
table {
border-collapse: collapse;
width: 100%;
}
td {
border: 1px solid #ccc;
padding: .23em;
}
.footer {
position: absolute;
color: red;
bottom: 0;
}
</style>
</head>
<body>
<div class="page one">
<p>
Some info Here... at the top of first page
</p>
<!-- Zen Coding: table>tbody>(tr>td>{A sample table}+td>{Foo bar})*42 -->
<table>
<tbody>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
</tbody>
</table>
</div>
<div class="page two">
<table>
<tbody>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
<tr><td>A sample table</td><td>Foo bar</td></tr>
</tbody>
</table>
<p class="footer">
The last info here in the bottom of last page
</p>
</div>
</body>
</html>
私はあなたが言っていることを理解するのに少し問題があります。 「テーブルの直後」と「テーブルの最後」のコンテンツの違いは何ですか?
tfoot
要素mightあなたが探しているもの:
<table>
<thead>
<tr><th>Header</th></tr>
</thead>
<tfoot>
<tr><th>Footer</th></tr>
</tfoot>
<tbody>
<tr><td>Data</td></tr>
<tr><td>Data</td></tr>
<tr><td>Data</td></tr>
</tbody>
</table>
そうでない場合は、詳しく説明していただけますか?あなたが持っているHTMLの短い例、またはそれがどのように見えるか、そしてあなたがそれをどのように見せたいかについての写真が役立つかもしれません。