HI ...">

Geek Answers Handbook

HTML string in Html2Canvas

How to pass a valid HTML string in html2canvas?

eg

var html = "<html><head></head><body><p>HI</p></body></html>

How to do it at http://html2canvas.hertzen.com/screenshots.html

Html2canvas is really wonderful and all, but it is very poorly documented.

+4
source share
2 answers

You can do the following

 var iframe=document.createElement('iframe'); $('body').append($(iframe)); setTimeout(function(){ var iframedoc=iframe.contentDocument||iframe.contentWindow.document; $('body',$(iframedoc)).html('<html><head></head><body><p>HI</p></body></html>'); html2canvas(iframedoc.body, { onrendered: function(canvas) { $('body',$(document)).append(canvas); $('body',$(document)).remove(iframe); } }); }, 10);

See all the code here :

Demo

+3
source

Usually html2canvas displays DOM elements, not HTML code. But you can create a temporary iFrame, let your html render in that iFrame, and then provide the generated DOM html2canvas.

You can find an example in jsfiddle to play around or here for your convenience:

 var html_string = "<html><head></head><body><p>HI</p></body></html>"; var iframe=document.createElement('iframe'); document.body.appendChild(iframe); setTimeout(function(){ var iframedoc=iframe.contentDocument||iframe.contentWindow.document; iframedoc.body.innerHTML=html_string; html2canvas(iframedoc.body, { onrendered: function(canvas) { document.body.appendChild(canvas); document.body.removeChild(iframe); } }); }, 10);
+6
source

More articles:


All Articles