Html2canvas: SVGElement.offsetWidth устарел и будет удален в M50 примерно в апреле 2016 г.

Собирался это поднять! Слегка обеспокоенный что-то просто перестанет работать в этом месяце.

Да видимо на Opera 37 beta не работает. Кроме того, в последней версии плагина проблемы с отображением фона и границ. У меня один, не проверяют?

В демонстрации также не отображаются фон и границы ((

Это большая проблема, поскольку наши SVG-файлы больше не будут отображаться.

Самый большой виноват в этой функции:

function offsetBounds(node) {
    var parent = node.offsetParent ? offsetBounds(node.offsetParent) : {top: 0, left: 0};

    return {
        top: node.offsetTop + parent.top,
        bottom: node.offsetTop + node.offsetHeight + parent.top,
        right: node.offsetLeft + parent.left + node.offsetWidth,
        left: node.offsetLeft + parent.left,
        width: node.offsetWidth,
        height: node.offsetHeight
    };
}

lines 1887 - 1898 в html2canvas.js

Все offsetTop, offsetLeft, offsetWidth, offsetHeight теперь не определены для SVG

Рекомендуемое решение - getBoundingClientRect() , но оно по-прежнему не работает.

У кого-нибудь есть решение для этого?

@MarcBalaban Я еще не пробовал, но разве это не просто добавление этого к возврату в этой функции;

if ( node.tagName === 'SVG' ) {
    return node.getBoundingClientRect();
  }

@Dayjo, к сожалению, нет, он определенно на правильном пути, но эта строка

var parent = node.offsetParent ? offsetBounds(node.offsetParent) : {top: 0, left: 0};

также не выполняется должным образом, поскольку offsetParent также был амортизирован:

Хм, да, если присмотреться, возможно, здесь потребуется что-то вроде функции getBoundingBoxInArbitrarySpace; https://svn.apache.org/repos/asf/commons/sandbox/gsoc/2010/scxml-js/trunk/src/javascript/scxml/cgf/util/svg.js согласно http://stackoverflow.com / questions / 5996005 / how-to-use-element-offsetparent-with-html-svg-elements # ответы

Хотя еще не было возможности провести какое-либо тестирование.

Есть новости по этому поводу? Спасибо!

@chemitaxis - несмотря на предупреждение, пока у меня не было проблем с результатом html2canvas. Однако кто знает, будет ли это изменение действительно реализовано в Chrome?

Похоже, теперь Chrome перестал работать. Кажется, что SVG либо вообще не отображаются, либо неправильно, либо имеют неправильный масштаб / положение на холсте.

@niklasvh - есть мысли по этому

Я попробовал это сделать, используя https://svn.apache.org/repos/asf/commons/sandbox/gsoc/2010/scxml-js/trunk/src/javascript/scxml/cgf/util/svg.js

Но не был уверен, где мне это нужно реализовать, я пробовал использовать обе функции offsetBounds и getBounds но безрезультатно. Координаты X и Y кажутся правильными, но ширина и высота неверны, не уверен, что это из-за того, что я использую css, чтобы сделать SVG 100% ширины контейнера и автоматической высоты. Потребуется провести более обширное тестирование.

У меня есть предварительная ветка (https://github.com/Dayjo/html2canvas/tree/issue-846), использующая последнюю бета-версию. если кто-то хочет протестировать, у него должна быть возможность использовать версию dist или просто пересобрать, если хотите. Не знаю, насколько хорошо / будет ли вообще это работать.

@Dayjo Да, я тоже это заметил. SVG находятся совершенно в неправильном положении и почти всегда не отображаются на экране, когда все смещения * оцениваются как undefined. Я также попробовал решить эту проблему с помощью рекурсивного getBoundingClientRect, но не повезло :( Я посмотрю на вашу ветку.

Решил ... Добавлю раствор в конце недели, если
иметь время. Извините за задержку ... Работает в FF, Safari и Chrome.
Лучший.
В среду, 29 июня 2016 г., в 19:00, Юки К. [email protected] написал:

@Dayjo https://github.com/Dayjo Да, я тоже это заметил. SVG - это
полностью в неправильном положении и почти всегда за пределами экрана, когда
все смещения * оцениваются как неопределенные. Я тоже пробовал свои силы в решении
это с использованием рекурсивного getBoundingClientRect - но не повезло :( Я возьму
посмотрите на свою ветку.

-
Вы получаете это, потому что вас упомянули.
Ответьте на это письмо напрямую, просмотрите его на GitHub
https://github.com/niklasvh/html2canvas/issues/846#issuecomment -229420457,
или отключить поток
https://github.com/notifications/unsubscribe/ABWsecUQ2l-rxisMZ4HCKu1nh-mbIMU1ks5qQqSQgaJpZM4IDr12
.

@chemitaxis Замечательно ! С нетерпением жду исправления.

Привет, @chemitaxis , можешь ли ты создать пиар или ссылку на свой форк, если у тебя есть время?

@chemitax есть в этом прогресс? Я надеюсь протестировать код в проекте, над которым я работаю, чтобы увидеть, решит ли он все мои проблемы с SVG, особенно с IE.

Привет @atdiff :) Решил проблему с помощью других библиотек ...