Почему мои прямоугольники HTML5 отображаются увеличенными?

После http://www.html5canvastutorials.com/tutorials/html5-canvas-rectangles/, я нарисовал несколько прямоугольников рядом на холсте. Проблема в том, что они кажутся сильно увеличенными; при увеличении 1,0 они появляются примерно в пять раз больше своего первоначального размера; они имеют правильный размер (если нечеткие по краям) при увеличении около 0,16.

Я ожидаю, что смогу найти обходной путь, увеличив размеры холста в пикселях и уменьшив масштаб, но как правильно получить масштабирование 1: 1 на холсте? Для холста заданы ширина и высота, равные 100 %, а поле body равно 0. Ручная установка ширины и высоты холста в соответствии с высотой и шириной окна не меняет этого поведения.

ТИА,


person Christos Hayward    schedule 30.11.2012    source источник


Ответы (1)


проблема в том, что вы устанавливаете ширину и высоту стиля для холста. Вам нужно установить атрибуты ширины и высоты, а не стиль css. так что-то вроде:

<canvas id='mycanvas' width='800' height='600'></canvas>

Дополнительная информация по аналогичному вопросу: Canvas растягивается при использовании CSS, но нормально со свойствами ширины/высоты

person kennypu    schedule 30.11.2012