Javascript 如何使用html2canvas在下载的pdf中捕获徽标和当前日期
我正在使用jspdf打印和下载pdf格式的div内容。在这里,我还需要以pdf格式捕获页面左上角的图像和页面右上角的当前日期作为我的html。可能需要在html2canvas中使用position和addimage。我是html2canvas的新手,有人能帮我吗?这是代码 htmlJavascript 如何使用html2canvas在下载的pdf中捕获徽标和当前日期,javascript,html,html2canvas,Javascript,Html,Html2canvas,我正在使用jspdf打印和下载pdf格式的div内容。在这里,我还需要以pdf格式捕获页面左上角的图像和页面右上角的当前日期作为我的html。可能需要在html2canvas中使用position和addimage。我是html2canvas的新手,有人能帮我吗?这是代码 html 尝试在base64中转换图像 var src = 'data:image/png;base64,iVBORw0K.......' //doc.addImage(src, 'PNG', x, y, w, h); doc
尝试在base64中转换图像
var src = 'data:image/png;base64,iVBORw0K.......'
//doc.addImage(src, 'PNG', x, y, w, h);
doc.addImage(src, 'PNG', 0, 240, 210, 57);
$(document).ready(function() {
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth()+1; //January is 0!
var yyyy = today.getFullYear();
if(dd<10) {
dd = '0'+dd
}
if(mm<10) {
mm = '0'+mm
}
today = mm + '/' + dd + '/' + yyyy;
$('#date').append(today);
$('#print').click(function() {
var currentPosition = document.getElementById("content").scrollTop;
var w = document.getElementById("content").offsetWidth;
var h = document.getElementById("content").offsetHeight;
document.getElementById("content").style.height="auto";
html2canvas(document.getElementById("content"), {
dpi: 300, // Set to 300 DPI
scale: 3, // Adjusts your resolution
onrendered: function(canvas) {
var img = canvas.toDataURL("image/jpeg", 1);
var doc = new jsPDF('L', 'px', [w, h]);
doc.addImage(img, 'JPEG', 0, 0, w, h);
doc.addPage();
doc.save('sample-file.pdf');
}
});
document.getElementById("content").style.height="100px";
document.getElementById("content").scrollTop = currentPosition;
});
});
body {
background: beige;
}
header {
background: red;
}
footer {
background: blue;
}
#content {
background: yellow;
width: 70%;
height: 100px;
margin: 50px auto;
border: 1px solid orange;
padding: 20px;
overflow-y:auto;
}
.html2canvas-container { width: 3000px !important; height: 3000px !important; }container { width: 3000px !important; height: 5000px !important; }
var src = 'data:image/png;base64,iVBORw0K.......'
//doc.addImage(src, 'PNG', x, y, w, h);
doc.addImage(src, 'PNG', 0, 240, 210, 57);