html2canvas创建一个宽度和高度为零的画布? [英] html2canvas creates a canvas with a width and height of zero?
本文介绍了html2canvas创建一个宽度和高度为零的画布?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想使用html2canvas做它在锡上说,但它不断创建一个宽度和高度为零的画布。
我这样做:
var HTMLString ='< p> hello world< / p>
var HTMLStringContainer = document.createElement('div');
HTMLStringContainer.innerHTML = HTMLString;
console.log(HTMLStringContainer);
html2canvas(HTMLStringContainer,{
onrendered:function(newCanvas){
document.getElementById(image)appendChild(newCanvas);
}
}
当我打印 HTMLStringContainer
code>< div>< p> hello world< / p>< / div> ,看起来是否正确。
Snippet
< pre class =snippet-code-js lang-js prettyprint-override>
var HTMLString ='< p> hello world< / p>'; var HTMLStringContainer = document.createElement('div') ; HTMLStringContainer.innerHTML = HTMLString; console.log(HTMLStringContainer); html2canvas(HTMLStringContainer,{onrendered:function(newCanvas){document.getElementById(image)。appendChild(newCanvas);}});
< script src =https://github.com/niklasvh/html2canvas/ releases / download / 0.4.1 / html2canvas.js>< / script>< div id =image>< / div>
div>
此外,jsfiddle:
http://jsfiddle.net/4077wxLj/
解决方案
要作为画布渲染的元素需要在DOM中,例如 document.body
的子项,然后才能呈现。
I'm trying to use html2canvas do what it says on the tin, but it keeps creating a canvas with a width and height of zero. I'm doing this:
var HTMLString = '<p>hello world</p>';
var HTMLStringContainer = document.createElement('div');
HTMLStringContainer.innerHTML = HTMLString;
console.log(HTMLStringContainer);
html2canvas(HTMLStringContainer,{
onrendered:function(newCanvas){
document.getElementById("image").appendChild(newCanvas);
}
});
And when I print HTMLStringContainer
it shows <div><p>hello world</p></div>
, which looks correct.
Snippet
var HTMLString = '<p>hello world</p>';
var HTMLStringContainer = document.createElement('div');
HTMLStringContainer.innerHTML = HTMLString;
console.log(HTMLStringContainer);
html2canvas(HTMLStringContainer, {
onrendered: function(newCanvas) {
document.getElementById("image").appendChild(newCanvas);
}
});
<script src="https://github.com/niklasvh/html2canvas/releases/download/0.4.1/html2canvas.js"></script>
<div id="image"></div>
Also, jsfiddle: http://jsfiddle.net/4077wxLj/
解决方案
The element to render as a canvas needs to be in the DOM, such as a child of document.body
, before it can be rendered.
这篇关于html2canvas创建一个宽度和高度为零的画布?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文