由于某些我无法理解的原因,html2canvas没有捕获div的整个高度。
html2canvas($container, {
height: $container.height(),
onrendered: function(canvas) {
var data = canvas.toDataURL('image/png');
var file = dataURLtoBlob(data);
var formObjects = new FormData();
formObjects.append('file', file);
$.ajax({
url: 'ajax_preview',
type: 'POST',
data: formObjects,
processData: false,
contentType: false,
}).done(function(response){
console.log(response);
//window.open(response, '_blank');
});
}
});
我还尝试手动设置高度height: $container.height()
但不幸的是图像不断被切断。我也尝试设置高度1124,但结果是一样的。
很难看到,但在下面的图片中,您会看到图像的白色部分没有任何边框。我在该部分所拥有的一切都没有显示出来。
有什么可能导致这种行为的想法?
答案 0 :(得分:1)
<强>解决强>
我的代码实际上是正确的,问题出在我使用的CSS文件上。 为了避免这种情况,我将div删除并再次调用文件,同时将div转换为图像。
// $= means that ends with
("link[href$='my.css']").remove();
html2canvas($container, {
onrendered: function(canvas) {
var data = canvas.toDataURL('image/png');
var file = dataURLtoBlob(data);
// etc
$('head').append("<link href='" + base_url + "public/css/my.css' rel='stylesheet'/>");
}
});