canvasの文字がぼやける・にじむ 他【HTML5】
ハマったのでメモ。
fillTextで書いた文字がにじむ
結論から言うと、ここに書いてあることをやればいい。windowsなのでRatinaディスプレイ云々は関係ないと思い込みスルーしていたのだが、windowsの設定で「全体を大きくする」を使用していたことをすっかり忘れていた。
以下、ついでにハマったことメモ。
fillTextの高さがおかしい
高さの基準がデフォルトでalphabeticになっているため、CSS感覚で指定すると何か上にずれる。textBaselineをtopに指定すれば解決する。
canvasの画像をリサイズする
上の方法でcanvasの内部解像度を大きくすると、画像にした時に環境によって画像サイズが変わってしまう。jsで新しくサイズ固定のcanvasを作成し、そこに元canvasをdrawImageするのが手っ取り早い。
Author And Source
この問題について(canvasの文字がぼやける・にじむ 他【HTML5】), 我々は、より多くの情報をここで見つけました https://qiita.com/udoP_/items/bba03df1825023fba63b著者帰属：元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .