3

HTMLをPDFに変換しようとしていますが、直面している問題は、HTMLテーブルタグの幅が正しく設定されていないことです..

これは私のhtmlです

<table cellpadding='4' cellspacing='4' border='0' width='100%' style='width:100%'>
    <tr style='background-color:#000000'>
        <td colspan='2' align='center' valign='middle' width='100%'>
            <font face='Calibri' size='6' color='#FFFFFF'>Retail Natural Gas Deal Sheet</font>
        </td>
    </tr>
    <tr>
        <td colspan='2' width='100%'>&nbsp;</td>
    </tr>
    <tr>
        <td width='90%' style='width:90%'>
            <table cellpadding='0' cellspacing='0' border='0' width='100%'>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='4'>
                            <b>Deal Number</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='4'>
                            <b>15RTLG7149</b>
                        </font>
                    </td>
                </tr>
                <tr>
                    <td colspan='3' width='100%'>&nbsp;</td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Trade Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Price Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Authorize Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td colspan='3' width='100%'>&nbsp;</td>
                </tr>
            </table>
        </td>
        <td width='10%' style='width:10%' valign='top'>
            <table cellpadding='0' cellspacing='0' border='0' width='100%'>
                <tr>
                    <td colspan='2' align='center' width='100%'>
                        <font face='Calibri' size='2'>
                            <b>Volumes (MMMBtu)</b>
                        </font>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

これは私がpdfを生成するために使用しているc#コードです

        Document pdfDoc = new Document();
        //Document pdfDoc = new Document(PageSize.A4, 10f, 10f, 10f, 0f);
        //HTMLWorker htmlparser = new HTMLWorker(pdfDoc);
        using (MemoryStream memoryStream = new MemoryStream())
        {
            PdfWriter writer = PdfWriter.GetInstance(pdfDoc, memoryStream);
            pdfDoc.Open();
            XMLWorkerHelper.GetInstance().ParseXHtml(writer, pdfDoc, new StringReader(HTML));
            pdfDoc.Close();
            byte[] bytes = memoryStream.ToArray();
            memoryStream.Close();

            return bytes;
        }

しかし、これがpdfでのレンダリング方法です..正しい答えを見つけることができません..助けが必要です..よろしくお願いします..

http://i.stack.imgur.com/8WyBh.jpg

4

1 に答える 1

3

HTML をコピーしてテキスト エディタに貼り付けました (Notepad++; 以下のスクリーン ショットで 1 とマークされています)。この HTML をブラウザーで開きました (Chrome、下のスクリーン ショットで 2 とマークされています)。HTML を PDF に変換しました (XML Worker を使用。PDF は以下のスクリーンショットで 3 とマークされています)。

ここに画像の説明を入力

ブラウザーに表示されたものと PDF に表示されたものを比較すると、iText の XML Worker が素晴らしい仕事をしているという印象を受けます。ブラウザに表示されるものと PDF に表示されるものに大きな違いはありません。

しかし、あなたの HTML を見ると、矛盾が見られます。ブラウザで HTML を表示しようとしましたか? あなたが期待したようには見えませんよね?問題は iText が原因ではないようですが、HTML の作成方法が原因です。HTML がブラウザで期待どおりに表示されるかどうかをお知らせください。そうでない場合は、期待することを説明してください。現時点では、PDF で表示される内容とブラウザーで表示される内容が非常によく一致しているため、問題を理解するのは困難です。

アップデート:

あなたの質問では、境界線 ( border='0') を追加しておらず、意味がわかりにくかったです。HTML が次のようになるように、境界線を追加しました。

ここに画像の説明を入力

PDF を次のようにします。

ここに画像の説明を入力

HTML を次のように単純化すると、これは非常に簡単です。

<table cellpadding='4' cellspacing='4' border='1' width='100%' style='width:100%'>
    <tr style='background-color:#000000'>
        <td colspan='2' align='center' valign='middle'>
            <font face='Calibri' size='6' color='#FFFFFF'>XXXX XXXXX XXXXX</font>
        </td>
    </tr>
    <tr>
        <td colspan='2'>&nbsp;</td>
    </tr>
    <tr>
        <td width='90%' style='width:90%'>
            <table cellpadding='0' cellspacing='0' border='1' width='100%'>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='4'>
                            <b>Deal Number</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='4'>
                            <b>XXXXXXXXXX</b>
                        </font>
                    </td>
                </tr>
                <tr>
                    <td colspan='3' width='100%'>&nbsp;</td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Trade Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Price Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Authorize Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td colspan='3' width='100%'>&nbsp;</td>
                </tr>
            </table>
        </td>
        <td width='10%' style='width:10%' valign='top'>
            <table cellpadding='0' cellspacing='0' border='1' width='100%'>
                <tr>
                    <td colspan='2' align='center' width='100%'>
                        <font face='Calibri' size='2'>
                            <b>Xxxxxxx (XXXXXXX)</b>
                        </font>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

私は何を変えましたか?タグの を削除しwidth='100%'ました。この情報はあいまいです: 2 つの列を合わせて幅の 100% を取る必要があると言っています。でも:<td>colspan='2'

  • <table>および_width='100%'
  • セルに colspan 2 があり、このセルが幅の 100% を取る必要があると言った場合、各列の幅を知る方法はありません。そこに置いても意味がありませんwidth='100%'

iTextSharp は、幅に関する情報を見つけることができる最初の行に基づいて、列の幅を定義します。この場合、そのような情報の最初の行幅は、2 列のテーブルの colspan 2 の行です。これらの 2 つの列の幅を 100% として定義すると、iTextSharp は、各列が幅の 50% (100% / 2) を占めると言いたいかのようにこれを解釈します。

このあいまいな情報を削除すると、iText は 3 行目に定義された幅に基づいて列の幅を定義します (これは予想どおりです)。

于 2015-09-24T16:01:29.847 に答える