EaselJS линия нечеткости

Question

Я использую EaselJS в качестве API для холста HTML5.

Я заметил, что следующий код:

line.graphics.setStrokeStyle(1).beginStroke("black").moveTo(100,100).lineTo(200,200);
stage.addChild(line);

... производит следующую строку:

Я установил толщину на 1 - но линия все еще нечеткая. Если вы увеличите снимок, вы увидите, что он на самом деле занимает 3 пикселя. Я полагаю, что когда я читаю где-то, холст рисует точку между двумя пикселями, так что оба пикселя будут фактически окрашены. И вам нужно сместить точку рисования на половину ширины пикселя, чтобы она приходилась на весь пиксель.

Мне нужно четкое изображение для моих приложений, пожалуйста, сообщите.

Answer 1

EaselJS - это просто абстракция для API-интерфейсов Canvas, которая рисует все линии по указанным координатам. API SnapToPixel специально предназначен для автоматического округления, но не учитывает проблему полупикселя, которую вы описываете.

Наилучший подход заключается в том, чтобы поместить все в контейнер и поместить контейнер в положительное или отрицательное значение (0,5,0,5) - что все отрегулирует, и вы сможете работать в обычном координатном пространстве, а не смещать все свои вычисления.