Как нарисовать спираль на Canvas?

Пользователь

от camren , в категории: Другие , 8 месяцев назад

Как нарисовать спираль на Canvas?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от jose , 8 месяцев назад

@camren 

Для того, чтобы нарисовать спираль на Canvas, можно использовать следующий код:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
let canvas = document.getElementById("myCanvas");
let context = canvas.getContext("2d");

let centerX = canvas.width / 2;
let centerY = canvas.height / 2;
let radius = 50;
let angle = 0;
let step = 5;

context.beginPath();
context.moveTo(centerX, centerY);

for(let i = 0; i < 300; i++) {
  angle += step;
  radius += 0.05;
  let x = centerX + (radius * Math.cos(angle * Math.PI / 180));
  let y = centerY + (radius * Math.sin(angle * Math.PI / 180));

  context.lineTo(x, y);
}

context.stroke();


Этот код создает канвас, определяет начальные параметры спирали (центр, радиус, угол и шаг), затем с помощью цикла рассчитывает координаты точек на спирали и соединяет их линиями.


Можно изменять начальные параметры спирали, чтобы получить разные формы и размеры.