Welcome Guest Search | Active Topics | Sign In | Register

Dynamically generated canvas is blank Options
Paul Prewett
Posted: Monday, May 6, 2013 5:06:43 PM
Rank: Member
Groups: Member

Joined: 5/6/2013
Posts: 11
Hi,

We're using the D3 library WordCloud (http://www.jasondavies.com/wordcloud) on one of our pages and attempting to render the page as PDF. The rendering is not working properly when the PDF renders. The canvas is blank. We're using ASP.NET MVC, capturing the action result as HTML and then calling HtmlToPdf.ConvertHtml(...) to do the work.

The wordcloud component uses logic to place each word at run time and I suspect that there's some issue with it not being able to properly figure out its bounds when running through the PDF converter, but that's only an assumption. What you'll see in the link below is that there's a debug message which appears below the rendered wordcloud, indicating how many words got skipped during the placement operation. When rendering to the screen, 0 words get skipped. When rendering to PDF, all 35 words get skipped.

Here is a test link:
http://cmiresearch.com/paul/wordcloud/wordcloud

I can provide the code for this small MVC project if you'd like. It's a few hundred lines, which mostly consist of extension methods to the controller which allow us to get the HTML for an action, rather than sending it as part of the response - which we then pass off to the PDF generator.

Please let me know your thoughts on the issue.

Thanks.
eo_support
Posted: Monday, May 6, 2013 5:46:24 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,229
Hi,

Does WordCloud uses Java? If it does use Java (not JavaScript) to render, then it won't work. Our converter does not load any third party plugins (such as Flash, Java, etc). If you have to have the words, then you may want to look into WordCloud to see whether it can generate the text image on the server side as an image, then reference the result image in your HTML (the same way almost all chart component works). That will work because there would be no third party plug-in involved.

Thanks!
Paul Prewett
Posted: Tuesday, May 7, 2013 10:13:31 AM
Rank: Member
Groups: Member

Joined: 5/6/2013
Posts: 11
It is a pure javascript solution, so no Java involved. Does it make sense at all that the script may have trouble finding its proper bounds when being rendered via the PDF component. Is there anything additional that I can provide to help get to the bottom of the issue?
Paul Prewett
Posted: Tuesday, May 7, 2013 10:17:02 AM
Rank: Member
Groups: Member

Joined: 5/6/2013
Posts: 11
I should also note that the appearance of the debug message below the cloud indicates that all of the javascript executed successfully, as that is the last bit that executes and it's dependent on everything else executing to get its information. So it's something with the placement logic that's going wrong in the context of the PDF render.

Thanks.
eo_support
Posted: Tuesday, May 7, 2013 10:18:35 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,229
Hi,

When we load wordcloud's home page and runs its demo page, it loads Java. It should work if it was pure JavaScript.

Thanks!
Paul Prewett
Posted: Tuesday, May 7, 2013 10:29:14 AM
Rank: Member
Groups: Member

Joined: 5/6/2013
Posts: 11
And what about my example page? No Java loads on that page. They must be doing something else on their example page.
eo_support
Posted: Tuesday, May 7, 2013 10:39:28 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,229
Hi,

You are right. Your sample page uses SVG, which should work with our converter. We will debug into it and get back to you as soon as possible.

Thanks!
eo_support
Posted: Wednesday, May 8, 2013 4:41:58 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,229
Hi,

We looked into the test page and noticed that the place() function for WordCloud always fails. We do not understand the logic of their JavaScript code so we do not know why it fails. If you can contact them to debug through it, they might be able to tell you why the code runs differently. When they debug their code, they can use our debug output feature to output debug information:

http://www.essentialobjects.com/doc/4/htmltopdf/js.aspx

They will need to use the "DebugConsole" feature.

Thanks!
Paul Prewett
Posted: Tuesday, June 4, 2013 4:25:16 PM
Rank: Member
Groups: Member

Joined: 5/6/2013
Posts: 11
Ok - I have isolated the problem down to a very simple html page that demonstrates the problem succinctly. If you plug this into an html page and then try to pass that HTML to the ConvertHtml(...) method, the "draw me" text does appear in the browser, but not in the rendered PDF.

Please advise. Thanks.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<canvas id="myCanvas" width="500" height="500"></canvas>
<script type="text/javascript">
function runMe() {
var canvas = document.getElementById("myCanvas");
var canvasContext = canvas.getContext("2d");
canvasContext.fillStyle = "blue";
canvasContext.font = "bold 16px Arial";
var toDraw = "draw me";
canvasContext.fillText(toDraw, 100, 100);
}
runMe();
</script>
</body>
</html>
eo_support
Posted: Tuesday, June 4, 2013 6:05:45 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,229
Hi,

Thanks for the update. This does appear to be an issue. We do not know why it doesn't work yet, we are looking into it hopefully will be able to fix it.

However this does not seem to be the same problem for your original post. With your original page, we clearly see the result was created in SVG. The difference between SVG and Canvas is SVG is rendered in vector format, while as Canvas is rendered as bitmap, so when it zooms out, it loses quality. So SVG is still the preferred option.

Thanks!
Paul Prewett
Posted: Monday, June 17, 2013 10:37:23 AM
Rank: Member
Groups: Member

Joined: 5/6/2013
Posts: 11
Do you have an update on this support item?

Thanks.
eo_support
Posted: Monday, June 17, 2013 11:42:15 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,229
Yes. We already have an internal build that should fix this problem. You should have it in a few days.

Thanks!
Paul Prewett
Posted: Monday, July 1, 2013 1:43:35 PM
Rank: Member
Groups: Member

Joined: 5/6/2013
Posts: 11
As far as I can tell, the new build released over the weekend does not solve this problem. Can you confirm?
eo_support
Posted: Monday, July 1, 2013 1:58:07 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,229
Hi,

No. It does not. We thought we had a build that fixed this problem, but that was wrong. I can confirm that the issue is not fixed yet. Sorry about the delay.

Thanks!
Paul Prewett
Posted: Monday, July 1, 2013 1:59:50 PM
Rank: Member
Groups: Member

Joined: 5/6/2013
Posts: 11
Can you give me an idea of how long for a build that will resolve the issue?
eo_support
Posted: Monday, July 1, 2013 3:18:20 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,229
Hi,

Unfortunately we do not know yet. We are still working on this but we do not know the root cause of the problem yet. So we are unable to give an ETA on this one. I would recommend you to use SVG instead of Canvas in the meantime. Sorry about it!

Thanks!
Paul Prewett
Posted: Monday, July 1, 2013 3:22:00 PM
Rank: Member
Groups: Member

Joined: 5/6/2013
Posts: 11
Just as a heads up, SVG isn't a valid workaround for this case. Our javascript logic uses Canvas to do the measurement/placement and then SVG to do the actual rendering. That's not something I have control over, so this is a blocking issue for us until it is resolved.

Thanks for your help, and please keep us updated.
eo_support
Posted: Monday, July 1, 2013 5:03:16 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,229
I see what you meant. We will certainly keep you updated.

Thanks!
Paul Prewett
Posted: Wednesday, September 11, 2013 1:02:24 PM
Rank: Member
Groups: Member

Joined: 5/6/2013
Posts: 11
Is there an update on this item?
eo_support
Posted: Wednesday, September 11, 2013 1:07:37 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,229
Unfortunately no. We have not been able to resolve this one yet. Sorry about it!


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.