ΠΠΎΠΆΠ½ΠΎ Π»ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ getElementByID ΡΠΎΠ»ΡΠΊΠΎ Π΄Π»Ρ ΠΏΠ΅ΡΠ°ΡΠΈ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Π½Π° Ρ ΠΎΠ»ΡΡΠ΅?
ΠΡΠΏΠΎΠ»ΡΠ·ΡΡ ΠΏΠΎΡΠ»Π΅Π΄Π½ΡΡ Π²Π΅ΡΡΠΈΡ, ΠΎΠ½Π° Π±ΡΠ΄Π΅Ρ ΡΠ°Π±ΠΎΡΠ°ΡΡ ΡΠΎΠ»ΡΠΊΠΎ Ρ document.body.
$("#myButton").click(function () {
html2canvas(document.getElementById('myTable'), {
allowTaint: true,
imageTimeout: 15000,
logging: true,
useCORS: true
}).then(function (canvas) {
document.body.appendChild(canvas);
const b64 = canvas.toDataURL("image/png").replace(/.*,/, '');
console.log("data:image/png;base64, " + b64)
});
});
ΠΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, Π²Π°Ρ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΏΡΠΎΠΊΡΡΡΠΈΠ²Π°Π΅ΡΡΡ Π²Π²Π΅ΡΡ ΠΈΠ»ΠΈ Π²Π½ΠΈΠ·. ΠΠΎΠΏΡΠΎΠ±ΡΠΉΡΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ scrollX: -window.scrollX ΠΈ scrollY: -window.scrollY
$("#myButton").click(function () {
html2canvas(document.getElementById('myTable'), {
allowTaint: true,
imageTimeout: 15000,
logging: true,
useCORS: true,
scrollX: -window.scrollX,
scrollY: -window.scrollY
}).then(function (canvas) {
document.body.appendChild(canvas);
const b64 = canvas.toDataURL("image/png").replace(/.*,/, '');
console.log("data:image/png;base64, " + b64)
});
});
ΠΡΠ»ΠΈΡΠ½ΠΎ, ΡΡΠΎ ΡΠ΅ΡΠΈΠ»ΠΎ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ, ΡΠΏΠ°ΡΠΈΠ±ΠΎ.
ΠΠΎΠΆΠ°Π»ΡΠΉΡΡΠ°, ΠΏΠΎΠΆΠ°Π»ΡΠΉΡΡΠ°, Π·Π°ΠΏΠΈΡΠΈΡΠ΅ ΡΡΠΈ Π΄Π²Π° ΡΠ²ΠΎΠΉΡΡΠ²Π° Π² ΠΎΡΠ½ΠΎΠ²Π½ΡΠ΅ ΠΏΡΠΈΠΌΠ΅ΡΡ Π² ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΈΠΈ Ρ ΡΠ°ΡΡΠΎΠΉ ΠΏΡΠΎΠΊΡΡΡΠΊΠΎΠΉ Π²ΠΎ Π²ΡΠ΅ΠΌΡ ΡΠΊΡΠΈΠ½ΡΠΎΡΠ°. Π‘ΠΌ. ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΉ Π²ΡΡΠ΅ https://github.com/niklasvh/html2canvas/issues/2368#issuecomment -701920277.
scrollX: -window.scrollX,
scrollY: -window.scrollY
Π‘Π°ΠΌΡΠΉ ΠΏΠΎΠ»Π΅Π·Π½ΡΠΉ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΉ
ΠΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, Π²Π°Ρ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΏΡΠΎΠΊΡΡΡΠΈΠ²Π°Π΅ΡΡΡ Π²Π²Π΅ΡΡ ΠΈΠ»ΠΈ Π²Π½ΠΈΠ·. ΠΠΎΠΏΡΠΎΠ±ΡΠΉΡΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ scrollX: -window.scrollX ΠΈ scrollY: -window.scrollY