I am converting responsive HTML to PNG. The image generated does not match the HTML when rendered in a browser. I have tried setting the width of the HTML being rendered, but failed to find a property or method to do so.
… I have just tried to upload a sample HTML to illustrate the issue and was informed that new users can’t upload attachments. Well, I guess that mean I am not buying your product then.
Thank you for contacting support.
We would like to request you to share the source HTML and generated PNG file along with the code snippet that you are using for this conversion. So that we can try to reproduce and investigate it in our environment. Before sharing requested data, please ensure using Aspose.HTML for .NET 18.3 in your environment.
Moreover, everyone can attach files to their post by clicking the Upload button in the header of post editor, or you can drag and drop your attachments as well. Please note that the upload limit for such attachments is 3 MB and if your files exceed this size, then you can share with us by uploading it to any file sharing server like Google Drive, Dropbox etc.
Please find attached a zip file containing 2 files:
The HTML is responsive. As you can see the layout of the HTML does not match that of the image. The image was generated at a width of 700px.
Output.zip (61.2 KB)
Thank you for sharing requested data.
We have worked with the data shared by you and have been able to reproduce the issue in our environment. A ticket with ID HTMLNET-1156 has been logged in our issue management system for further investigation and resolution. The issue ID has been linked with this thread so that you will receive notification as soon as the issue is resolved.
We are sorry for the inconvenience.
Any update on this issue?
We would like to share with you that the issue reported by you has been scheduled for investigations and the tentative version to include a fix for it is, Aspose.HTML for .NET 18.6 which will be released in the start of June 2018. We will notify you as soon as the ticket will be resolved. We appreciate your patience and comprehension in this regard.
Thank you for being patient.
We would like to share with you that the issue reported by you, HTMLNET-1156, has been resolved in Aspose.HTML for .NET 18.6. Following PNG images are attached for your kind reference. We have used A4 page options to generate these files.
var options = new ImageRenderingOptions();
//A4 page
options.PageSetup.AnyPage = new Page(new Size(Unit.FromMillimeters(210), Unit.FromMillimeters(297)))
{
Margin =
{
Top = Unit.FromPoints(62),
Left = Unit.FromPoints(90),
Right = Unit.FromPoints(90),
Bottom = Unit.FromPoints(62)
}
};
We hope this will be helpful. Please feel free to contact us if you need any further assistance.
Hi,
I still seem to be having issues. Please attached HTML and generated PNG.
I also need the image to one single image and not only the first A4 page.
I don;t understand where your code fits into the overall code. Herewith my code. Please use this as the base line and adapt accordingly.
Aspose.Html.Rendering.Image.ImageRenderingOptions pdf_options = new Aspose.Html.Rendering.Image.ImageRenderingOptions();
// Instantiate PdfDevice object while passing PdfRenderingOptions and resultant file path as arguments
using (var memoryStream = new MemoryStream())
{
using (var pdf_device = new Aspose.Html.Rendering.Image.ImageDevice(pdf_options, memoryStream))
{
// Create HtmlRenderer object
using (var renderer = new Aspose.Html.Rendering.HtmlRenderer())
{
// Create HtmlDocument instance while passing path of already created HTML file
using (var html_document = new Aspose.Html.HTMLDocument(html, “”))
{
// Render the output using HtmlRenderer
renderer.Render(pdf_device, html_document);
}
}
}
return memoryStream.ToArray();
}
Fiat Tipo Dealer Launch - CCDB.v2.zip (91.9 KB)
Fiat Tipo Dealer Launch - CCDB.v53.jpg (547.2 KB)
Thank you for getting back to us.
We have worked with the data shared by you and have been able to observe the issue of pages splitting when rendering to images. It has been logged with ticket ID HTMLNET-1354 in our issue management system. The issue ID has been linked with this thread so that you will receive notification as soon as the issue is resolved.
Moreover, shared code snippet can be used in your code as under:
Aspose.Html.Rendering.Image.ImageRenderingOptions pdf_options = new Aspose.Html.Rendering.Image.ImageRenderingOptions();
pdf_options.PageSetup.AnyPage = new Aspose.Html.Drawing.Page(new Aspose.Html.Drawing.Size(Unit.FromMillimeters(210), Unit.FromMillimeters(297)))
{
Margin =
{
Top = Aspose.Html.Drawing.Unit.FromPoints(62),
Left = Aspose.Html.Drawing.Unit.FromPoints(90),
Right = Aspose.Html.Drawing.Unit.FromPoints(90),
Bottom = Aspose.Html.Drawing.Unit.FromPoints(62)
}
};
...
We hope this will be helpful.
Hi Farhan,
The issue is not only with the page splitting. If you compare the image to the html you will find the image is broken and does not match the html at all.
Regards
We have compared generated images and noticed that the content till first image is present on first image and other content starting with “Dear Fiat Enthusiast” is present on second image. The ticket has been logged for this. In case you notice other problems, please elaborate with screenshots so that we may address your concerns accordingly.
Hi,
Any progress on resovling this issue?
Regards
Thank you for getting back to us.
We would like to update you that HTMLNET-1354 has been resolved in Aspose.HTML for .NET 18.8. Furthermore, it is a bit difficult to print your document into a single A4 page, because it is just a bit bigger than A4. Take a look at the attached screenshot HTMLNET-1354.jpeg. It is a ‘print preview’ from browser. The settings as you see on screenshot are: page-size - A4, margins - 0, However, preview contains two pages. The only way to fit that document into a single page is increase page size or, if it is possible, change the document itself.
Hi,
The image don’t need to fit onto a single page, if it overflows its fine. The rendering should just be consistent with that of the HTML.
Regards,
We have resolved the problem with rendering. Please try using latest version of the API and then share your kind feedback with us.