VPF::Рисование дуг на канвасе - Форум программистов

PsiMagistr

Дата 4.2.2020, 19:28 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 479
Регистрация: 31.12.2009

Репутация: нет
Всего: 1

Добрый вечер.

Ребята, есть канвас.
При нажатии на кнопку клавиатуры рисуется дуга. Так должно быть.
Почему при повторном нажатии, та же дуга замыкается в контур?

Код


let angle = 0;

function degToRad (deg)
{
    return deg * (Math.PI / 180);
}


let canvas = document.querySelector(".scena");
let scena = canvas.getContext("2d");
scena.lineWidth = 1;

document.addEventListener("keydown", function(){
    scena.clearRect(0, 0, 500, 500);
    alert("Канвас очишается");
    scena.arc(200, 200, 200, degToRad(0), degToRad(270), false);
    scena.stroke();
});

--------------------

"Арфы нет? Возьмите бубен!

Ребята, будем жить!"

(с) "В бой идут одни старики"

---

"ИЕ" - один из самых сумасшедших браузеров в нашей галактике.

ksnk

Дата 4.2.2020, 20:47 (ссылка)

(нет голосов)

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 48
Всего: 386

Все просто, с одной стороны... с другой - как посмотреть smile

первый клик:
Область очищается.
У тебя нет функции начала фигуры - beginPath, так что фигура начинается первым вызовом arc. рисуя нужную дуги и останавливаясь в верхней точке. Фигура состоит из одной дуги и она обрисовывается. Все, вроде как, правильно
Второй клик:
Область очищается.
фигура продолжается. Для начала следующей дуги фигура дополняется прямой линией к началу дуги и еще одной дугой того же размера. Итого фигура состоит из 2-х дуг одна над другой и соединяющего их отрезка. Фигура обрисовывается.
третий и т.д. клик:
область очищается, но фигура становится все больше и больше. Это выражается в том, что при отрисовке по тем же линиям толшина линий кажется больше.

Итого ошибка - нет beginPath и фигура остается одна и растет пр каждом клике.

Это сообщение отредактировал(а) ksnk - 4.2.2020, 20:48

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

PsiMagistr

Дата 5.2.2020, 12:21 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 479
Регистрация: 31.12.2009

Репутация: нет
Всего: 1

Цитата(ksnk @ 4.2.2020, 20:47)

область очищается, но фигура становится все больше и больше. Это выражается в том, что при отрисовке по тем же линиям толшина линий кажется больше.

Итого ошибка - нет beginPath и фигура остается одна и растет пр каждом клике.

Большое спасибо!

Дейcтвительно дело было в beginPath()

Единственное, что я как-то не заметил роста фигуры при последующих кликах. Замкнутый контур видел. А может этот рост очень мал.

--------------------

1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: для новичков \| Следующая тема »