火狐浏览器上渲染不佳/反抗的画布文本

Question

文本看起来像素化/别名（Firefox 和 opera）

由于似乎对实际问题无能为力，是否有任何怪癖/技巧可以减少这种影响？

谢谢/一个

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，但包含该内容是为了更好地衡量。