javascript - Firefoxでのレンダリングが不十分/アンチアラス化されたキャンバステキスト

Question

テキストはピクセル化/エイリアス化されたように見えます（FirefoxとOpera）

実際の問題についてはあまりすることがないようですが、この影響を減らす可能性のある癖/トリックはありますか？

ありがとう/A

context.textBaseline = 'top'
context.fillStyle = color
context.font = "16px gotham_htfregular"
context.fillText("HD", 15, 11)

Answer 1

canvasこれが役立つかどうかはわかりませんが、 ：内の画像のアンチエイリアスエッジを使用するのに役立ちました。

                canvas {
                  image-rendering: optimizeSpeed;
                  image-rendering: -moz-crisp-edges;
                  image-rendering: -webkit-optimize-contrast;
                  image-rendering: optimize-contrast;
                  -ms-interpolation-mode: nearest-neighbor;
}

注：これ-ms-interpolation-modeはIE用ですが、適切な測定のために含まれています。