Холст
• 173
внимание, что
drawSpiral
написана мной; это не какая-то стандартная функция, которая
строит путь для спирали и визуализирует ее на холсте с помощью последовательности
вызовов
stroke
):
ctx.translate(ctx.canvas.width/2,
¬ ctx.canvas.height/2);
drawSpiral(); // сложная спиральная математика
setInterval(function () {
ctx.clearRect(-ctx.canvas.width/2,
¬-ctx.canvas.height/2,
ctx.canvas.width,
¬ ctx.canvas.height);
ctx.rotate(Math.PI / 180 * 0.5) // 1/2
¬ градуса
drawSpiral();
}, 10);
Единственная сложность, с которой мне приходится столкнуться, — это очистка холста.
В обычной ситуации я бы просто применял
clearRect(0,
0,
width,
height)
, но так как
метод
translate
перенес точку
(0,
0)
в центр экрана, мне приходится вручную указывать
верхний левый угол, как видно в предыдущем фрагменте кода.
Достарыңызбен бөлісу: