Pull to refresh

«Паскалевская графика на HTML5» или «Что Opera сделала с Rainbow Dash»

Reading time1 min
Views10K
Увидел на тематическом сайте, посвящённом сериалу My Little Pony код на Turbo Pascal, использующий старинный модуль Graph и рисующий нескольких персонажей.

Код содержал только вызовы функций и комментарии, javascript отлично его парсил. Осталось только дописать свои графические функции.

Финальная версия

var colors = ["#000000", "#0000AA", "#00AA00", "#00AAAA", "#AA0000", "#AA00AA", "#AA5500", "#AAAAAA", 
"#555555", "#5555FF", "#55FF55", "#55FFFF", "#FF5555", "#FF55FF", "#FFFF55", "#FFFFFF"];
function setcolor(colorIndex)
{
	ctx.strokeStyle = colors[colorIndex];
}
function line(x1, y1, x2, y2)
{
	ctx.beginPath();
	ctx.moveTo(x1, y1);
	ctx.lineTo(x2, y2);
	ctx.stroke();
	ctx.closePath();
}
function setlinestyle(p, t, width)
{
	ctx.lineWidth = width;
}

function setfillstyle(t, colorIndex)
{
	ctx.fillStyle = colors[colorIndex];
}

function ellipse(x, y, st, end, xrad, yrad)
{
	ctx.save();
	ctx.translate(x, y);
	ctx.scale(xrad, -yrad);
	ctx.beginPath();
	ctx.arc(0, 0, 1, st * Math.PI / 180.0, end * Math.PI / 180.0, false);	
	ctx.restore();
	ctx.stroke();
}

function fillellipse(x, y, xrad, yrad)
{
	ctx.save();
	ctx.translate(x, y);
	ctx.scale(xrad, yrad);
	ctx.beginPath();
	ctx.arc(0, 0, 1, 0, Math.PI * 2, true);
	ctx.fill();
	ctx.closePath();
	ctx.restore();
}


Вот что вышло
На мою реализацию функции ellipse() плохо среагировала Opera:


Баг зарепортили.

Но я на этом не остановился, и результат можно наблюдать тут.



В данный момент думаю, как ещё всё это можно ускорить. Идеи?
Tags:
Hubs:
Total votes 115: ↑92 and ↓23+69
Comments114

Articles