Как сделать правильную проверку границ для рисования на холсте HTML5? - PullRequest
3 голосов
/ 26 июня 2010

При рисовании на холсте в Firefox, если вы попытаетесь нарисовать или перейти к точке за пределами холста, будет выдано сообщение об ошибке (это копируется / вставляется непосредственно из Firebug):

An invalid or illegal string was specified" code: "12

Другие браузеры не выдают ошибку. Это касается как методов рисования (lineTo, arc и т. Д.), Так и рисования изображений. Достаточно просто сделать быструю проверку границ, используя ширину и высоту холста перед рисованием, но как насчет рисования частей вещей?

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

У кого-нибудь есть обходной путь?

Одна из тех вещей, о которых я подумал, - это использование большого холста "мирового буфера", который затем копируется с холста дисплея. Другим может быть рисование каждого объекта в центре буферного холста, а затем копирование вновь нарисованных пикселей на экранное полотно в их правильном положении.

Что сделали люди, чтобы обойти эту проблему?

1 Ответ

1 голос
/ 26 июня 2010

Холст обрезает изображение до ограничивающего прямоугольника его вида. У вас не должно возникнуть проблем с рисованием за пределами этой ограничительной рамки. Он не будет отображаться на вашем чертеже. Опубликуйте конкретный пример, чтобы узнать, можем ли мы воспроизвести ошибку.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...