Export grid to png instead of pdf

1 Answer 57 Views
Grid
Joseph
Top achievements
Rank 1
Joseph asked on 16 Oct 2023, 02:36 PM

Hi all,

Is there a way to export a grid to png instead of pdf or convert the pdf output to a png in javascript?

Thanks,

Joseph Scott

1 Answer, 1 is accepted

Sort by
0
Zornitsa
Telerik team
answered on 19 Oct 2023, 12:49 PM

Hi Joseph,

You could export the Grid component to a PNG file format by using our Drawing library which supports the export to images:

Please note that you cannot draw an element that has a "display: none" or "visibility: hidden" property, since the DOM element of the Grid must be appended to the document and fully rendered.

Therefore, you could wrap the Grid in a container and export the visible part of the component with the exportImage method of the drawing API:

<button onclick="exportPNG()">Export PNG</button>
      <div id="container" style="width:100%">
        <div id="grid"></div>
      </div>
function exportPNG(){
     kendo.drawing.drawDOM($("#container"))
            .then(function (group) {
            return kendo.drawing.exportImage(group);
     }).done(function (data) {
            kendo.saveAs({
              dataURI: data,
              fileName: "grid.png",
            });                        
     })
}

Below you can find a Dojo example demonstrating the proposed approach:

I hope that the provided suggestion would be helpful for your scenario.

Regards,
Zornitsa
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Kendo family, check out our getting started resources
Tags
Grid
Asked by
Joseph
Top achievements
Rank 1
Answers by
Zornitsa
Telerik team
Share this question
or