abcpdf html图像拉伸答案

【问题标题】：abcpdf html image stretchingabcpdf html图像拉伸
【发布时间】：2012-04-04 11:30:32
【问题描述】：

我正在尝试渲染一个包含图像的 html 页面。

我有一个问题，当前图像的大小似乎翻了一番，我的图像是 304x112，当它呈现为 pdf 时，它是 607x224。

我确实找到了这个

屏幕分辨率通常为 96 dpi。因此，当您查看 HTML 页面时在您的显示器上，Windows 将以 96 dpi 显示它。

屏幕分辨率与 PDF 72 dpi 之间的差异分辨率意味着 HTML 在打印文档中看起来比它更大出现在屏幕上。

您需要应用 72/96 (0.75) 的比例来弥补这一点如果您希望两者显示相同的大小。

例如，如果您正在渲染一个提供值 800 的网页对于 Width 参数，您需要设置 Rect 的宽度如果您希望两者显示相同的大小，则为 600。

和

PDF 文档主要是基于矢量的。因此，他们不确实有 dpi，因为它们与分辨率无关。唯一的基于光栅的 PDF 部分是图像。

HTML 的大多数元素（文本、行）都是基于矢量的。所以他们是分辨率无关。

呈现网页中图像的分辨率是复杂的。假设您有一个 300 平方的图像，由图像标签。如果您的 Doc.Rect 的宽度与您的宽度相同传递给 AddImageUrl，然后它将以 72 dpi 呈现。然而，由改变这两个值之间的比率，图像将被缩放因此分辨率会改变。

并且...如果您的 300 正方形位于宽度和高度为的 img 标签中 150，则默认分辨率加倍。

我的问题似乎是第二部分中描述的问题。

我的最终结果是将输出添加到 a4 纵向页面，以便可以打印（连同文档中的其他文本，但可以正常工作）。

目前在渲染时我使用这个

doc.MediaBox.String = pageSize;
doc.Rect.String = pageSize;
doc.AddImageHtml(html, true, width, disableCache);

其中页面大小为“A4”，宽度在 addimagehtml 调用中设置为 800。

我尝试在设置页面大小后将 doc.Rect.Width 设置为 600，并将 addimagehtml 调用的宽度设置为 800，但图像仍然无法正确呈现。

我还有什么遗漏的吗？

编辑：要转换的页面的html是这样的：

<html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>Workpack</title> 
        <style>
             body { font-family: Arial, Helvetica, sans-serif; }
        </style>
    </head>
    <body style="border: 1px solid black;">
        <div style="height: 1100px;">
            <div style="position: absolute; top: 50%;">
                <div style="text-align: center; width: 780px;" >
                    <div>
                        <% if (!string.IsNullOrWhiteSpace(Model.CompanyLogo)){%>
                            <img src="<%: Url.ToFullyQualifiedUrl(Model.CompanyLogo) %>"/>
                            <% } %>
                    </div>
                    <div>
                        <h1><%: Model.PlantName %></h1>
                    </div>
                    <div style="font-size: 15pt; font-weight: bold;">
                        <h1><%: Model.WorkpackTitle %> - <%: Model.WorkPackNumber %></h1>
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>

【问题讨论】：

我也尝试过将 addimagehtml 宽度和 rect.width 都设置为 595 和 800，没有任何变化
你不能只使用 doc.rendering 选项并将 pdf 设置为 72 dpi 吗？？

标签： html image resolution dpi abcpdf

【解决方案1】：

没有看到实际的 HTML 很难说。基本思想是AddImageUrl/AddImageHtml 将填充Rect 的区域，因此要使最终输出中的图像更小，您可以减小Rect（使Rect 小于@987654326 @)。

或者，您可以减少width 参数。例如：

const string kHtml = "<html><img src='https://encrypted.google.com/images/srpr/logo3w.png'></html>";

// The img gets smaller and smaller....
foreach (var i in Enumerable.Range(1, 5))
{
    using (var doc = new Doc())
    {
        doc.Rect.String = doc.MediaBox.String = "A4";
        doc.AddImageHtml(kHtml, true, 400 * i, true);
        doc.Save(i + ".pdf");
    }
}

【讨论】：

我已经添加了 html，它非常简单，没什么特别的
那么它应该和上面的带有 Google logo 的 HTML 相当吗？如果是这种情况，也许我们可以使用更简单的 HTML 进行测试。运行上面的代码是否会给你缩放效果，从而解决图像分辨率问题？
看起来它确实给了我缩放效果，现在只需找出正确的值，使其看起来与在网页上查看时的大小相同
最终让它工作了，但是我必须使我的文本更大，并且页面上的所有内容都按比例缩小，因此文本大小与其他不需要的页面有点不一致像没有图像一样缩放。
@DanielPowell 尽管这很出乎意料，但也许您可以简单地缩放<img> 标签本身？同样，可能很难知道发生了什么，但是如果您将完整的隔离测试用例（带有 exe 和 HTML + 图像/CSS）发送到 ABCpdf 的支持电子邮件，那么可能会找到更优雅的解决方案。