html2canvasでfont-sizeが変わらないときの対処法!

 この記事は約1分で読めます。
JavaScript
こんにちは、はせです。

html2canvasとは簡単に
要素を画像に変換してくれるJSライブラリです。

今回は、html2canvasを使用して
動的コンテンツを画像に変換したときに
文字サイズが変更できないときの対処法を記します!

文字サイズを変更的ないときの対処法!

状態
要素としては文字のサイズを変更できるのですが、
画像に変換したら文字サイズが変わっていない

対処法
対象となる要素にフォント宣言を行う

上記のコードは一例なので、font-familyを変更しても良いと思います。
色々試してみてください。

原因
・フォントがサポートされておらず適応されない?
(Google Web Fontsを使用していた)

参考
doesn’t support font-family property with multiple value
 

おわりに

html2canvasはとても便利なライブラリですが、
バージョンによっては不具合が多くて
扱いが難しいです・・・。

 

       
   
コメントはまだありません

コメントを残す

JavaScript
jQueryで「自身の要素」のみイベントを起こす方法。親子の要素にも影響しない。

こんにちは、長谷川です。 今回は、要素に対してクリックなどのイベントを 親要素や子要素を無視し、その …

jsファイルかvue呼び出す
HTML5
Canvasで超簡単に点線・破線を引く方法!JavaScript

こんにちは、 今回はCanvasで点線、破線を簡単に引く方法を ご紹介致します。 なんとリファレンス …

JavaScript
classとidの取得する値が違ってエラーと対処法。JavaScript

JavaScriptである処理をしようとしていたのですが、 idでは出来てclassやNameではエ …