Html2canvas: Лишнее пустое пространство слева и потерянная часть справа

Спасибо за подробную информацию, без особой отладки, похоже, что это проблема с отображением / не отображением полос прокрутки и изменением ширины документа, смещением центрирования. Постараюсь исправить это как можно скорее

У меня такая же проблема, и действительно похоже, что она связана с полосами прокрутки. В Chrome я могу скрыть полосы прокрутки с помощью webkit, и он отлично работает, но не в других браузерах.

Мой обходной путь - скрыть полосы прокрутки перед рендерингом

Я добавляю приведенный ниже класс к элементу "html"

.hide-scrollbar {
    overflow: -moz-hidden-unscrollable;
    overflow: hidden;
}

Затем удалите его после рендеринга

$("html").addClass("hide-scrollbar"); //hide scrollbar because it is showing left white padding
html2canvas($(".artwork")[0]).then(function(canvas) {
    var dataURL = canvas.toDataURL();
    $(".renderedimg img").attr("src",dataURL);
});
$("html").removeClass("hide-scrollbar");

Подтвержденный. В моем случае всегда 7 пикселей (Chrome для Windows). Дополнение добавляет к этому.

Поскольку я не использую jQuery, я сделал следующее:

                document.documentElement.classList.add("hide-scrollbar");
                document.documentElement.classList.remove("hide-scrollbar");

Но реальное решение, конечно, было бы предпочтительнее и ценилось бы.

Что касается параметров, это дало лучший результат (ширина, ранее установленная для обертывающего div):

                        {
                            logging: true,
                            allowTaint: false,
                            backgroundColor: "#ffffff",
                            scale: 1
                        }

Если я не использовал «масштаб: 1», он увеличивался при использовании масштабированного текста в Windows. Это очень необходимо на экране ноутбука с высоким разрешением.

Если интересно, могу опубликовать свой вариант использования.

Я использую новейшую версию со следующими настройками, и у меня все еще возникают проблемы с заполнением полосы прокрутки, без полосы прокрутки она работает идеально, при размере экрана с полосой прокрутки у нее есть отступ, который обрезает img.

backgroundColor: null,
scrollX: 0,
scrollY: -window.scrollY,
масштаб: 1

Одно из моих решений.
html2canvas (element, {
width: $ (element) .width (), // проблема в том, что холст немного больше элемента, поэтому вам нужно установить его здесь
})

Все возможные проблемы я решил следующим образом ..

html2canvas(element , {
        scrollX: -window.scrollX,
        scrollY: -window.scrollY,
        windowWidth: document.documentElement.offsetWidth,
        windowHeight: document.documentElement.offsetHeight
})