|
|
Rank: Member
Groups: Member
Joined: 2/10/2014
Posts: 11
|
So here is my scenario. I generate a contract from html that is input by the user. This means that the contract varies in length. It could be one page, it could be 8 pages. However, at the end of every contract, there is always a line for a signature. I have an image of the signature I need to add, but my issue is, that I don't always know where the signature line will be. Right now, I have place holder text, so I could just replace that text with an html image. The issue I have with that, is it would require an internet connection and our server to always host the image files for it to work. These images are stored in the database, so I really just generate them as needed using asp.net system.drawing. My question is, is there some way I can put an image place holder in the pdf or something? Or any other ideas you have towards accomplishing my goal? Right now, what I have working (but requires the internet connection and points back to my server is something like this. dim html = "<div id='signDiv'><span id='signatureSpan'></span></div>" html = html.Replace("<span id='signatureSpan'></span>", "<img src='http://myWebsite.com/someImage.png' />") Then, I put that into the eo.pdf and call ConvertHtml. Like I said the issue is that div gets pushed to the end based on dynamically input content from the user, there's no way I can ever know that it will always be in spot x by y. If there's no place holders, I'm open to other ideas. Thanks,
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,196
|
Hi, There are two ways to do this. The first way is to use a data url for your image. You can find more information about data Url here: http://en.wikipedia.org/wiki/Data_URI_schemeThe second way relies on the HtmlToPdfResult object returned by ConvertHtml, you can use that object to get an element's position. The code will be something like this:
Code: C#
HtmlToPdfResult result = HtmlToPdf.ConvertHtml(....);
HtmlElement element = result.HtmlDocument.GetElementById("div1");
PdfPageLocation location = element.Location;
SizeF size = element.Size;
The location is provided in (page_index, x, y). All measurement are in inches. This allows you to find the location and size of your placeholder element. Once you know that, you can use the "PDF Creator" interface to render the image into the page directly. Hope this helps. Please feel free to let us know if you still have any more questions. Thanks!
|
|
Rank: Member
Groups: Member
Joined: 2/10/2014
Posts: 11
|
Ok, so I'm trying to follow your instructions and I think I'm close, I'm still not sure how I actually add the image to the document though. Here's what I have.
Code: Visual Basic.NET
HtmlToPdf.Options.AfterRenderPage = New PdfPageEventHandler(AddressOf OnAfterRenderPage)
'Zoom out slightly to fit more contents on one page
HtmlToPdf.Options.FirstPageNumber = 1
HtmlToPdf.Options.ZoomLevel = 0.8F
Dim result As HtmlToPdfResult = HtmlToPdf.ConvertHtml(content, fileName)
Dim custSigImg As New Drawing.PdfImage(Image.FromFile(imgPath & "custSig.png"))
Dim pdfCustImg As New Contents.PdfImageContent(custSigImg)
Dim pdfCustLocal As PdfPageLocation = result.HtmlDocument.GetElementById("custSig").Location
pdfCustImg.GfxMatrix.Translate(pdfCustLocal.X, pdfCustLocal.Y)
pdfCustImg.GfxMatrix.Scale(350, 88)
'not sure how I actually add the image to the pdf, considering the file has already been created by HtmlToPdf.ConvertHtml
How do I actually add that to the file, since it's already been created? Thanks,
|
|
Rank: Member
Groups: Member
Joined: 2/10/2014
Posts: 11
|
So I looked through some more documentation and was able to get the image in the pdf, but I have 3 small problems. 1. As soon as I run it once, the image file gets locked and I can't delete/rename/move it. 2. The image is going clear to the bottom left corner. 3. I'm trying to put a custom size on the image, but that doesn't seem to be working, it's just putting the image in as it's original size. Here is the code I'm using, can you help me modify it to get it to work?
Code: Visual Basic.NET
EO.Pdf.Runtime.AddLicense(Resources.Resources.EopdfKey)
HtmlToPdf.Options.AfterRenderPage = New PdfPageEventHandler(AddressOf OnAfterRenderPage)
'Zoom out slightly to fit more contents on one page
HtmlToPdf.Options.FirstPageNumber = 1
HtmlToPdf.Options.ZoomLevel = 0.8F
Dim result As HtmlToPdfResult = HtmlToPdf.ConvertHtml(content, fileName)
'get the image
Dim custSigImg As New Drawing.PdfImage(Image.FromFile(imgPath & "custSig.png"))
Dim pdfCustImg As New Contents.PdfImageContent(custSigImg)
'get the divs location
Dim pdfCustLocal As PdfPageLocation = result.HtmlDocument.GetElementById("custSig").Location
'set the x and y coordinates
pdfCustImg.GfxMatrix.Translate(pdfCustLocal.X, pdfCustLocal.Y)
'set the image size
pdfCustImg.GfxMatrix.Scale(350, 88)
Dim doc As New PdfDocument(fileName)
'add it to the document
doc.Pages(pdfCustLocal.Page.Index).Contents.Add(pdfCustImg)
'save it
doc.Save(fileName)
'need to figure out why the location of the image is off, why the image isn't resizing, and why the file gets locked
Dim resp = System.Web.HttpContext.Current.Response
resp.Clear()
resp.ContentType = "text/pdf"
resp.AddHeader("Content-Disposition", "attachment; filename=" & stamp & ";")
resp.TransmitFile(fileName)
resp.Flush()
resp.End()
Here's part of the actual html I'm dropping in the pdf. The is just the relevant part is towards the end. There are a couple pages before this of other html.
Code: HTML/ASPX
<html>
<head>
<link rel='Stylesheet' src='https://jobs.sprayapplications.com/main.css' href='text/css' />
</head>
<body style='font-size: 12px; font-family: arial;'>
<!-- start of footer --><br /><hr />
<table cellpadding='0' cellspacing='0' style='width: 100%;'>
<tr>
<td valign='top' style='text-align: left;width: 45%;padding-right: 20px;'>
<b>Acceptance of the proposal.</b> The above prices, specifications, and conditions are satisfactory and are hereby accepted. You are authorized to do the work as specified. Payment will be made as outlined above.
</td>
<td valign='top' style='text-align: left;width: 50%;'>
We agree to furnish the above items and conditions herein contained. All agreements contingent upon strikes, Acts of God, or other causes beyond our control.
</td>
</tr>
</table>
<hr />
<table cellpadding='0' cellspacing='0' style='width: 100%;'>
<tr>
<td valign='top' style='text-align: left;width: 45%;padding-right: 20px;'>
<b>Date of Acceptance 12/11/2014</b>
</td>
<td valign='top' style='text-align: left;width: 50%;'>
<b>This contract price is void after 30 days</b>
</td>
</tr>
<tr><td> </td><td></td></tr><tr><td> </td><td></td></tr>
<tr>
<td>
<div style='text-align: center; width: 100%;font-weight: bold;'>Purchaser</div>
<div style='width: 95%; margin-left: auto; margin-right: auto;border-bottom: solid 1px black;padding-top: 15px;'>
<div id='custSig'></div>
</div>
</td>
<td>
<div style='text-align: center; width: 100%;font-weight: bold;'>Contractor</div>
<div style='width: 95%; margin-left: auto; margin-right: auto; border-bottom: solid 1px black;padding-top: 15px;'>
<div id='empSig'></div>
</div>
</td>
</tr>
</table>
<br /><br />
</body>
</html>
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,196
|
Hi,
Your code looks fine except that the coordinate unit for GfxMatrix.Translate is NOT inch. It's 1/72 inch. So you must do the conversion first.
As for the image size, the problem might still be the unit. The unit is 1/72 inch, not in pixels. Further more, the image itself has a resolution as well. For example, if the image's internal resolution is 96 DPI, then an image of 96 pixel by 96 pixel would have a size of 1 inch by inch. That translate into Scale(72, 72) since the PDF unit is 1/72 inch.
Hope this helps. Please let us know if this resolves the issue for you.
Thanks!
|
|
Rank: Member
Groups: Member
Joined: 2/10/2014
Posts: 11
|
If I'm following you, I'd need to divide the position by 72 to get it in the proper spot, correct? Because I tried that and it still puts the image at the bottom
Also, the image gets locked every time I run my test site and I can't do anything with it until I kill visual studio. Do you know why the image is getting locked? I'm accessing it per your documentation.
pdfCustImg.GfxMatrix.Translate(pdfCustLocal.X / 72, pdfCustLocal.Y / 72)
|
|
Rank: Member
Groups: Member
Joined: 2/10/2014
Posts: 11
|
I'll also note I manually played with the x and y coordinates until I got the image where it needed to be, however the numbers made no sense. For the one document I was testing on this worked
pdfCustImg.GfxMatrix.Translate(90, 225)
I then looked at the x and y numbers of the PdfPageLocation and they were 1.14 (x) and 7.06 (y) I don't see any relation to the x and y numbers and the 90 and 225.
Like I said the 90 and 225 worked for this one document, but I need it to be dynamic as that spot isn't always in the same place.
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,196
|
Hi,
That makes perfect sense. When you uses the HTML to PDF:
1. The origin is at the top/left corner excluding page margin. This is consistent with the coordination system in a web page;
2. The unit is in inch;
When you use the low level API, it does everything in PDF's internal coordination system. In this system:
1. The origin is at the bottom/left corner without page margin;
2. The unit is in 1/72 inch;
In your case, X value can be calculate as this:
(1 + 1.14) * 72 = 154.08
The above calculation assumes that you have a one inch left margin during HTML to PDF conversion.
Y value can be calculated as this:
(11 - 1 - 7.06) * 72 = 211.68
The above calculation assumes that:
1. Full paper height is 11 inch;
2. Top margin is 1 inch during HTML to PDF conversion;
These are close to your value. The difference probably has to do with your page margins or margins/padding on your HTML element.
Hope this clears up. Please feel free to let us know if you still have any questions.
Thanks!
|
|