MAC
MAC

Reputation: 6577

Converting HTML Table into Image File

Is there any way to Convert HTML table to Image file? I have one HTML table which contains controls like Labels, GridView, and CheckBoxes. How can we convert this table into Image file for creating a PDF file?

Upvotes: 2

Views: 2252

Answers (4)

Ali Parsa
Ali Parsa

Reputation: 131

Datatables is a powerful jquery plugin for working with tables. One of the option that datatables offered is make a pdf or excel from your table. You can see find many examples in it's website.

Upvotes: 0

Ramprit Sahani
Ramprit Sahani

Reputation: 1

Converting HTML Table into Image File

            $("#selfAssessmentPowerPointDownload").on('mouseover', function () {
                var element = $("#html-content-holder"); // global variable
                var getCanvas; // global variable
                html2canvas(element, {
                    onrendered: function (canvas) {
                        getCanvas = canvas;
                        var imgageData = getCanvas.toDataURL("image/png");
                        var newData = imgageData.replace(/^data:image\/png/, "data:application/octet-stream");
                        $("#selfAssessmentPowerPointDownload").attr("download", "gridData.png").attr("href", newData);
                    }
                });
            });
<button id="selfAssessmentPowerPointDownload">Download</button>


<table id="html-content-holder"></table>

Upvotes: 0

Basic
Basic

Reputation: 26766

If this is a one-off, load it up in your browser and take a screenshot (Alt-PrtScr on windows for just the current application)

If you need to do this repeatedly/in an automated way, you can either automate a browser control or you can use a headless browser

You should also look into WebKit2Png which will render the page in the same manner as Chrome/other webkit browsers and then save that as a png. It can optionally simulate javascript/etc too

Similarly, there's a wkhtmltopdf which works on all platforms

Upvotes: 2

Jonathan Wood
Jonathan Wood

Reputation: 67355

This is not a trivial task. Ultimately, you need an HTML renderer to convert the HTML to pixels.

Fortunately, you don't need to write your own. You can use the WebBrowser control.

You can see some code I wrote to extract a thumbnail image from a given URL in the article Creating Website Thumbnails in ASP.NET.

Upvotes: 2

Related Questions