Html2canvas: Kanvas kosong saat mendapatkan elemen dengan ID

Dibuat pada 28 Sep 2020  ·  3Komentar  ·  Sumber: niklasvh/html2canvas

Apakah mungkin menggunakan getElementByID untuk hanya mencetak elemen tertentu ke kanvas?

Menggunakan versi terbaru dan hanya akan berfungsi dengan 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)
        });
    });

Komentar yang paling membantu

Mungkin elemen Anda digulir ke atas atau ke bawah. Coba dengan menambahkan scrollX: -window.scrollX dan 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)
        });
    });

Semua 3 komentar

Mungkin elemen Anda digulir ke atas atau ke bawah. Coba dengan menambahkan scrollX: -window.scrollX dan 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)
        });
    });

Sempurna, itu memecahkan masalah terima kasih.

Tolong tolong tolong tuliskan kedua properti ini ke contoh utama sesuai dengan sering menggulir saat tangkapan layar. Lihat komentar di atas https://github.com/niklasvh/html2canvas/issues/2368#issuecomment -701920277

scrollX: -window.scrollX,
scrollY: -window.scrollY
Apakah halaman ini membantu?
0 / 5 - 0 peringkat

Masalah terkait

koreanman picture koreanman  ·  4Komentar

bishwapoudel picture bishwapoudel  ·  4Komentar

AlphaDu picture AlphaDu  ·  4Komentar

Loki180 picture Loki180  ·  4Komentar

celik75 picture celik75  ·  4Komentar