Html2canvas: Иконки FontAwesome не отображаются только в firefox

Не могли бы вы настроить пример на jsfiddle?

http://jsfiddle.net/3ub69/

Возникла та же проблема с настраиваемым шрифтом значка. Он работает в Safari и Chrome, но не работает в Firefox и IE.

Покопался и заставил работать в Firefox 26 и IE 11. Проблема заключается в следующей строке:

https://github.com/niklasvh/html2canvas/blob/master/src/Parse.js#L951

Попробую объяснить, почему это происходит. Некоторые из моих предположений могут быть ошибочными, поэтому не стесняйтесь поправлять меня.

Кажется, что в не-webkitbrowser объект, который возвращается getComputedStyles, устанавливает только числовые свойства { 0: 'fontFamily' } для объекта и пары значений ключа { fontFamily: 'fontawesome' } для прототипа. Поскольку Object.keys работает как цикл for in с Object.hasOwnProperty он не учитывает пары значений, поэтому кажется, что стиль css не копируется.

Чтобы исправить это, вы можете заменить Object.keys() , метод filter и метод forEach на цикл for in .

for (var prop in elStyle) {
  if (indexedProperty(prop) && prop !== 'cssText') {
    // Prevent assigning of read only CSS Rules, ex. length, parentRule
    try {
      elps.style[prop] = elStyle[prop];
    } catch (e) {
      h2clog(['Tried to assign readonly property ', prop, 'Error:', e]);
    }
  }
}

Причина, по которой я проверяю prop !== 'cssText' заключается в том, что в Firefox это всегда пустая строка (ошибка?). Кажется, если вы скопируете эту пустую строку в псевдоэлемент, она снова сбросит fontFamily.

Надеюсь это поможет.

@Enome, это очень хорошо, хотя я еще не тестировал, отправьте, пожалуйста, «Pull Request».

Благодаря! : +1:

Делал ли @Enome запрос на

@fpslater Я никогда не делал

FontAwesome также не может отображаться в браузерах webkit, таких как Chrome и PhantomJS.

@kmdavis Вы пробовали html2canvas v0.5?

В настоящее время мы используем html2canvas v0.5.0-alpha

Не могли бы вы привести простой пример на jsfiddle, где проблема может быть воспроизведена или http://jsfiddle.net/3ub69/52/ для вас не работает?

У меня тоже есть эта проблема. Как мне перейти на html2canvas v0.5? Мне глупо спрашивать об этом, но я не вижу такой ветки или тега в этом репо.

Заранее спасибо.

PS Я использую html2canvas через rails-assets с gem 'rails-assets-html2canvas и следующим файлом bower.json :

{
  "name": "My-App",
  "dependencies": {
    "html2canvas": "https://github.com/niklasvh/html2canvas"
  }
}

Из того, что я вижу на https://rails-assets.org/components, для rails-assets доступны только версии <= 0.4.1. Поэтому я просто добавил последний dist / html2canvas.js в свою папку app/assets/javascripts/vendor/ и пока буду использовать его таким образом. Спасибо за создание этой невероятно полезной библиотеки!

@sweetleon Попробуйте html2canvas.js на тот, который я здесь модифицировал. У меня это сработало.

https://github.com/fpslater/fix-html2canvas-webkit-font-conversion

@sweetleon Да

У меня такая же проблема

Проблема с fontawesome по-прежнему возникает в версии html2canvas 1.0.0-alpha.12.

Любое решение? благодаря

Проблема с fontawesome по-прежнему возникает в версии html2canvas 1.0.0-rc.5