升级 WKHTMLTOPDF 后的布局问题答案

【问题标题】：Layout issues after upgrading WKHTMLTOPDF升级 WKHTMLTOPDF 后的布局问题
【发布时间】：2019-04-20 19:10:30
【问题描述】：

我以前看起来很棒的所有布局现在都搞砸了，升级WKHTMLTOPDF 后似乎使用不同且更小的字体呈现。全角 div 的渲染也比以前更小。

我尝试在 wicked 中修改 dpi 标志，当设置为 dpi: 300 时，我看到了一个小的差异，但无论更改为 dpi，差异似乎都无法解决问题。有人有任何提示吗？很确定问题在于对 WKHTMLTOPDF 所做的更改。

我们将这些版本锁定了一段时间，因为渲染后的 PDF 看起来很棒：

wicked_pdf (1.1.0)
wkhtmltopdf-binary (0.9.9.3)（使用 NimbusSansL Bold & Regular 字体渲染）

我们有一项新功能需要更好地处理长表中的分页符。升级后分页符运行良好，但现在我们遇到了更多问题，以下是新版本：

wicked_pdf (1.2.2)
wkhtmltopdf-binary (0.12.4)（现在使用字体、DejaVuSans、Bold 和 Regular 进行渲染）

渲染代码：

  respond_to do |format|
    format.html
    format.pdf do
      render pdf: 'report',
             template: 'download_report.pdf.erb',
             show_as_html: params[:debug].present?,
             layout: 'report_application.pdf',
             margin: {
                 top: 5,
                 bottom: 5,
                 left: 5,
                 right: 5
             }
    end
  end

【问题讨论】：

标签： wkhtmltopdf wicked-pdf wkhtmltopdf-binary

【解决方案1】：

添加zoom 选项似乎解决了我的大部分布局问题。受影响的 div 已定义并需要定义像素宽度。我通过将其中一个 div 的大小调整回其先前渲染的大小来确定缩放量。将新宽度除以旧宽度以获得缩放：

  respond_to do |format|
    format.html
    format.pdf do
      render pdf: 'report',
             zoom: 1.27,
             template: 'download_report.pdf.erb',
             show_as_html: params[:debug].present?,
             layout: 'report_application.pdf',
             margin: {
                 top: 5,
                 bottom: 5,
                 left: 5,
                 right: 5
             }
    end
  end

【讨论】：