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

سأحاول شرح سبب حدوث ذلك. قد تكون بعض افتراضاتي خاطئة ، لذا لا تتردد في تصحيحها.

يبدو أن الكائن الذي يتم إرجاعه بواسطة getComputedStyles في non-webkitbrowser يعين فقط الخصائص الرقمية { 0: 'fontFamily' } على الكائن وأزواج القيمة الرئيسية { fontFamily: 'fontawesome' } على النموذج الأولي. نظرًا لأن Object.keys يعمل مثل حلقة for in مع Object.hasOwnProperty فإنه يترك أزواج القيم لذا يبدو أنه لا يتم نسخ نمط css.

لإصلاحها يمكنك استبدال Object.keys() وطريقة التصفية وطريقة 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 ، هذا جيد جدًا ، على الرغم من أنني لم أختبر بعد ، يرجى إرسال "طلب سحب".

شكر! : +1:

هل قام Enome بتقديم طلب سحب بشأن هذا الموضوع؟ أنا أستخدم الكود الخاص به حاليًا كحل بديل.

fpslater لم أقدم طلب سحب قط. إذا كنت أتذكر بشكل صحيح ، فقد ذهبت بعيدًا عن محاولة تحويل html -> canvas وبدأت في استخدام svg بدلاً من ذلك.

فشل FontAwesome أيضًا في العرض لي في متصفحات webkit مثل Chrome و PhantomJS

kmdavis هل جربت html2canvas v0.5؟

نحن نستخدم حاليًا html2canvas v0.5.0-alpha

هل يمكنك تقديم مثال بسيط على jsfiddle حيث يمكن تكرار المشكلة أو هل http://jsfiddle.net/3ub69/52/ لا يعمل من أجلك؟

أواجه هذه المشكلة أيضًا. كيف أقوم بالترقية إلى html2canvas v0.5؟ أشعر بالسخافة عندما أسأل هذا ، لكنني لا أرى مثل هذا الفرع أو العلامة في هذا الريبو.

شكرا لك مقدما.

ملاحظة: أنا أستخدم html2canvas عبر أصول القضبان مع gem 'rails-assets-html2canvas bower.json والملف التالي

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

من ما أراه في https://rails-assets.org/components فقط الإصدارات <= 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