Видимо, в JS-стране нет ничего святого. Даже не пиксели!
Если вы столкнулись с проблемой размытого текста/линий внутри холста, скорее всего, вы видите ее на экранах с высоким разрешением.
Как вы определяете экран с высоким разрешением из javascript? Через window.devicePixelRatio. Проверьте, если это › 1.
Хорошее объяснение того, почему эта проблема может возникнуть:
- http://stackoverflow.com/a/2588404/2461067
- https://html.spec.whatwg.org/multipage/scripting.html#attr-canvas-width
Решение
Увеличьте плотность растрового изображения холста и получите качественное изображение для экранов с высоким разрешением. Задайте для атрибутов «ширина» и «высота» элемента холста произведение window.devicePixelRatio и размера документа/окна просмотра холста. Это будет соответствовать плотности пикселей растрового изображения плотности пикселей физического устройства!
Разработчики спецификации HTML5 могут быть такими:
Эй, чувак, мы слышали, что ты любишь пиксели, поэтому мы обернули твои пиксели внутри пикселей, чтобы ты мог смотреть на пиксели, наблюдая за пикселями.
