// Переменные
var canvas, ctx;
var bPlay = false;
var iAngle = 0;
var sText = 'Привет! 3D текст по кругу. ';
// Функции рисования
function clear() { // Очистка элемента canvas
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
}
function drawScene() { // Основная функция вывода сцены
if (bPlay == 1) {
clear(); // Очистка элемента canvas
// Заполняем фон
ctx.fillStyle = '#d7e8f1';
ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
// Меняем угол
iAngle+=0.005;
// и выводим текст по кругу с радиусом 200 в центре элемента canvas
draw3DTextCircle(sText, canvas.width / 2, canvas.height / 2, 200, Math.PI / 2 - iAngle);
}
}
function draw3DTextCircle(s, x, y, radius, iSAngle){
// Радиан на символ
var fRadPerLetter = 2*Math.PI / s.length;
// Сохраняем контекст, переводим и вращаем его
ctx.save();
ctx.translate(x,y);
ctx.rotate(iSAngle);
// Количество дополнительных нижних слоев
var iDepth = 4;
// Устанавливаем темно-зеленый цвет для дополнительных слоев
ctx.fillStyle = '#168d1e';
// Обрабоатываем каждый символ строки
for (var i=0; i
07
08
09
10
14
21