Листинг 17.3

ctxCanvas.beginPath();

ctxCanvas.strokeStyle = "red";

ctxCanvas.fillStyle = "red";

ctxCanvas.moveTo(100, 100);

ctxCanvas.quadraticCurveTo(200, 100, 200, 200);

ctxCanvas.lineTo(100, 200);

ctxCanvas.lineTo(100, 100);

ctxCanvas.fill();

Web-сценарий из листинга 17.3 рисует красный сектор окружности с красной же заливкой. Мы проводим кривую Безье с одной контрольной точкой, имеющую вид дуги, и соединяем ее начальную и конечную точки с центром воображаемой окружности.

Задание 4. Реализуйте Web-сценарий из листинга 17.4, рисующий прямоугольник со скругленными углами. В виде комментариев допишите происходящее в каждой строке кода.

Листинг 17.4