I am trying to usehtml2canvas to export some divs in .png format. My div has a greater height than my body which is not a problem because I can use the windowHeight option with myDiv.scrollHeight and it works perfectly.
function exp(e) {
html2canvas(e, {
windowWidth: e.scrollWidth,
windowHeight: e.scrollHeight * 1.12
}).then((canvas) => {
let a = document.createElement("a");
a.download = 'capture_' + date + '.png';
a.href = canvas.toDataURL("image/png");
a.click();
});
}
Now, the thing is, the div I'm "screening" is resizable. It shouldn't be a problem given I use the scrollHeight value but it takes the actual height into account instead of scrollHeight.
I tried pretty much everything I could find on the internet, every configuration option on html2canvas, myDiv.scrollTo(0,0) as explain in this second answer
I don't know if it can help but here is my resize code :
function resize_height(e) {
topTab.scrollTop = 0
topTab.style.overflow = 'hidden'
const dx = m_pos_height - e.y;
m_pos_height = e.y;
topTab.style.height = (topTab.offsetHeight - dx) + "px"
botTab.style.height = cont - (topTab.offsetHeight - dx) + "px"
topTab.style.maxHeight = cont + 'px'
}
botTab.addEventListener("mousedown", function (e) {
if (e.offsetY < BORDER_SIZE_HEIGHT) {
m_pos_height = e.y;
document.addEventListener("mousemove", resize_height, false);
}
}, false);
document.addEventListener("mouseup", function () {
document.removeEventListener("mousemove", resize_height, false);
topTab.style.overflow = 'auto'
}, false);
topTab being the div I try to screen.