Click here to Skip to main content
15,935,248 members
Please Sign up or sign in to vote.
4.27/5 (3 votes)
See more:
Hi devlopers,

I am using dotnet 4.0 with c#,asp.net and html2canvas

In my Web application i need to export multiple grids to the ppt.

In this below jsfiddle i am having 87 grid views(tables) with data.

http://jsfiddle.net/LCVSk/19/[^]

when i click the save click button will need open the new window with the image mentioned grid(table) in the script. But it is not happening. it is opening the window with url is having 9412 characters.
If i have 87 grids(tables) image is not generating, i don't know what might be the reason.

Kindly help me out this issue.

In case, if i remove one grid views(tables) from the 87 grid views(tables), it means remove the
JavaScript
<div id="slide87">......</div>
Now the total grids(table) count is 86. in this case the table image is opening in the new window.

Please check the below jsfiddle having 86 grid viwes(tables) with data..

http://jsfiddle.net/kishoredoni/V7Btk/[^]

Please share your answers it might be cache memory problem or I am having huge data or anything else.

I am not getting any errors in html2canvas also.
Posted
Updated 21-May-14 20:16pm
v29
Comments
Sunasara Imdadhusen 16-May-14 1:59am    
Have you started writing code for the same
D-Kishore 20-May-14 0:19am    
Hi, See my latest updates, I have written the code.

1 solution

Hello,

I have forked your sample here[^]. After looking at your code what I realized that you were creating image representation of first table only. Also the window.open syntax you were using is not the correct syntax. Also remember that you can not pass very large data over URL. Here is the modified javascript.
JavaScript
$("#btnSave").click(
    function () {
        var hWin,img;
        html = "";
        hWin = window.open("", "");
        for (i = 1; i <= 10; i++) {
            html2canvas($('.' + i), {
                onrendered: function (canvas) {
                    var img, data;
                    data = canvas.toDataURL("image/png");
                    console.log(data);
                    img = hWin.document.createElement('IMG');
                    img.src = data;
                    hWin.document.body.appendChild(img);
                }
            });
        }
    }
);

Regards,
 
Share this answer
 
Comments
D-Kishore 20-May-14 3:37am    
Hi, Thanks prasad,
Yes for testing purpose I am creating image for only one table.<br>
If I have 87 tables, your code also showing blank page.<br>
what you have forked sample is having 86 tables, so your code is working there.<br>
I am having doubt now is there any limitations for the tables.
D-Kishore 20-May-14 6:10am    
One thing that you are saying that we can not pass very large data over URL.
In this case,
here not generated(87 tables) image data over URL(9412 characters) is lesser than the generated(86 tables) image data over URL(75900 characters).
If it is working for 86 tables and why its not working for 87 tables.
If we have 86 tables, I am generating only first table.its working fine.
If I have 87 tables also I am generating only first table. why its not working.
Please help me out prasad.
Prasad Khandekar 21-May-14 6:44am    
I have locally tested it with very simple tables (total 90). It seems html2canvas has some bug. In my tests it failed to render tables after 33 in IE. All table images thereafter were transparent images. In Chrome however it worked without any problems.

Regards,
D-Kishore 21-May-14 7:43am    
Yes prasad, what you are saying is correct,
I also tested with 160 simple tables, all the images are generated with out any issue,
Problem is that if we have large data tables even single image is not generated.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900