在每个页面上插入折叠标记（wkhtmltopdf） [英] Insert folding marks on every page (wkhtmltopdf)
问题描述
我正在使用wkhtmltopdf 0.12.2.1创建发票等等。
I'm using wkhtmltopdf 0.12.2.1 to create invoices and so on.
我需要在pdf的每个页面上显示折叠标记。如果内容大于1，如何在每个页面上使用javascript重复这些内容？
I need to display folding marks on every page in a pdf. How can I repeat them with javascript on every page, if the content is larger than one?
这是我的基本标记
<!DOCTYPE html>
<html>
<head>
<title>PDF Title</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body id="pdf-page">
<div class="marks">
<div class="mark mark-top mark-left"></div>
<div class="mark mark-top mark-right"></div>
<div class="mark mark-middle mark-left"></div>
<div class="mark mark-bottom mark-left"></div>
<div class="mark mark-bottom mark-right"></div>
</div>
<div id="print-area">
<div id="letter-head"></div>
<div id="subject-line">Subject</div>
<div id="document-content">
....
....
....
</div>
</div>
</body>
</html>
看起来基本上就像图片
推荐答案
好的，这花了我几天的时间来计算这个....因为互联网上没有例子（PHP / HTML / Javascript）。
我们得到了以下步骤：
Okay, this took me days to figuring this out.... because of the lack of examples on the internet (for PHP/HTML/Javascript). We got the following steps:
- 获取文件的DPI
- 设置元素到实际页面大小（看不见）
- 创建包装器/页面元素（您的案例
.marks） - 确定页面内容是否需要多页以适应
- get the DPI of your document
- set element to the real page size (out of sight)
- create wrapper/page element (your case
.marks) - determine if content of the page needs multiple pages to fit on
注意：我这样做没有当然，你需要玩游戏。
Note: I'm doing this without testing etc. and you need to play around of course.
...
<div class="marks">
<div class="mark mark-top mark-left"></div>
<div class="mark mark-top mark-right"></div>
<div class="mark mark-middle mark-left"></div>
<div class="mark mark-bottom mark-left"></div>
<div class="mark mark-bottom mark-right"></div>
</div>
...
<script>
// some static stuff found it somewhere on the internet
var PDF = {
width: 8.27, // inches, 210mm
height: 11.65, // inches, 296mm
margins: {
top: 1.97, left: 0.34,
right: 0.393700787, bottom: 0.393700787
}
};
$(document).ready(function() {
// get page sizes by creating 'shadow' element
var pageSize = $('<div></div>')
.css({
height: PDF.height +'in', width: PDF.width +'in',
top: '-100%', left: '-100%',
position: 'absolute',
})
.appendTo('body');
// set debug element
$('.debug').html(pageSize.height());
// set every page elements .marks to proper height
// dont forget the substract the header and footer height
$('.marks').height(pageSize.height() - footerHeight - headerHeight);
// @TODO: duplicate .marks to times a pages is created, and !!maybe!! set the top of .marks with pageSize.height()
});
</script>
我找到了代码的灵感这里。
这对我有用，因为我有固定的高度元素，需要重复它页面（在我的 .wrapper elm与你的 .marks 相同，它们是'相对'元素）。通过这种方式，我可以通过在您的情况下关闭 .marks 来确定何时打开新页面。
This worked out for me because I had fixed height elements and needed to repeat it on the page (in my .wrapper elm same as your .marks and they were 'relative' elements). In this way I could determine when to 'open' an new page by closing .marks in your case.
这篇关于在每个页面上插入折叠标记（wkhtmltopdf）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
