5

0.79と0.7.2の両方を使用すると、生成されたPDFは元のHTMLとは少し異なります。show_as_htmlフラグを追加すると、期待どおりに表示されますが、インラインスタイルはPDFでの処理と、HTMLプレビューでの処理が異なります。

特に私が抱えている問題は、フロートが正しくレンダリングされていない文字間隔宣言にあります。したがって、たとえば、文字間隔のある右側のfloat要素では、PDFは文字の間隔を広げすぎて、文字間隔の幅の違いのためにテキストがさらに左にぶつかるのではなく、テキストが画面から部分的に外れるように中央から配置します。 。

元のHTMLスニペットは次のとおりです。

<table width="800" border="0">

  <tr>
    <td colspan="3"><span style="font-family:Helvetica, Arial, sans-serif;font-size:10pt;margin-top:18px;text-transform:uppercase;float: right;letter-spacing:2pt">Winter 2013</span></td>
  </tr>
</table>

レンダリングを行うコードは次のとおりです。

render :pdf => 'file_name', :template => 'template.html.erb', :layout => 'pdf.html'

レンダリングされたHTMLは次のとおりです：http：//jsfiddle.net/wX4DQ/

出力されたPDFは次のとおりです：http：//imgur.com/sdUPM

これについて、 wkhtmltopdfに関連していると思われるバグレポートがいくつかあることに気づきました。それがこの問題の原因である可能性がありますが、許容できる回避策は何ですか？

さまざまなフォントを試しましたが、実際にはHelveticaを使用する必要があります。

ここで何をするか、またはもっともらしい回避策について何か提案はありますか？

4

2 に答える 2

3

テキストのレンダリングと文字間隔の問題を引き起こす可能性があるものはたくさんあります。バイナリを使用している場合は、QT に対してコンパイルされたものを取得してみてください。自分で wkhtmltopdf をコンパイルした場合は、コンパイルしたシステムに適切なフォント セットがインストールおよび登録されていることを確認してください。そうしないと、書体が正しく表示されません。

また、このCSSのビットは、特にいくつかの文字の間にランダムな余分なスペースがあるコピー/貼り付けで役立ちます:

body { text-rendering: optimize-speed; }
于 2012-09-03T14:45:07.413 に答える
0

同様の問題があり、font-familyGoogle からインポートしたものに変更することで解決できました。詳細と可能な解決策は、この質問にあります。簡単に言うと、これは問題を解決するためのコードです。

@import url('https://fonts.googleapis.com/css?family=Open+Sans');
body {
    font-family: "Open Sans";
}
于 2016-07-07T14:20:10.463 に答える