<!DOCTYPE html>
<html>
<body>
<canvas id="myCanvas" width="500" height="500" style="border:1px solid
#d3d3d3;" >
</canvas>
<script>
let c = document.getElementById("myCanvas");
let ctx = c.getContext("2d");
let angle = 0;
let sz = 50;
let symbol = "А";
ctx.fillStyle = '#' + Math.floor(Math.random()*16777215).toString(16);
let t1 = setInterval(function(){
angle+=30;
let x = 250+ Math.round(Math.cos(angle*(Math.PI/180))*sz);
let y = 250+ Math.round(Math.sin(angle*(Math.PI/180))*sz);
ctx.font = "30px Arial";
ctx.fillText(symbol, x, y);
if (angle == 360) {
angle = 0;
sz+=25;
if (symbol == "Ё" ) clearInterval(t1);
if (symbol == "Е" ) symbol ="Ё";
if (symbol == "Д" ) symbol ="Е";
if (symbol == "Г" ) symbol ="Д";
if (symbol == "В" ) symbol ="Г";
if (symbol == "Б" ) symbol ="В";
if (symbol == "А" ) symbol ="Б";
}
}, 100);
</script>
</body>
</html>
| 