<html>
<head>
<script>
// escreva tudo isso em vermelho no bloco de notas e salve com o nome de script.html
// Atenção! Não é pra salvar com o nome de script.html.txt
// se vc ver o símbolo do navegador no arquivo é pq deu certo.
// Se vc ver o símbolo do bloco de notas é pq vc não sabe mudar a
// extensão do arquivo.
// se não souber como faz pra mudar a extensão do arquivo: procura no google
// lembre-se dos espaços e das quebras de linha.
manterLimites = function(angulo)
{
while(angulo>=360)
{
angulo=angulo-360;
}
while(angulo<0)
{
angulo=angulo+360
}
return angulo;
}
getSenCos = function(angulo)
{
angulo = manterLimites(angulo);
seno = Math.sin(angulo * Math.PI / 180);
cose = Math.cos(angulo * Math.PI / 180);
return [cose, seno];
}
arvores_mandala = new Image()
arvores_mandala.src = "arvores_mandala.png"
arvores = function(ctx, x1, y1, tamanho, angulo, poda, stroke)
{
var senCos= getSenCos(angulo)
var tx = x1+tamanho*senCos[0]
var ty = y1+tamanho*senCos[1]
ctx.lineWidth = 1;
ctx.beginPath();
r = 0.5;
if( poda>1 )
{
// momento em que acrescentamos novos ramos (Novas somas)
arvores (ctx, tx, ty, tamanho*r, angulo+90,poda-1 , stroke)
arvores (ctx, tx, ty, tamanho*r, angulo, poda-1 , stroke)
arvores (ctx, tx, ty, tamanho*r, angulo-90,poda-1 , stroke)
arvores (ctx, tx, ty, tamanho*r, angulo+180,poda-2 , stroke)
}
else
{
//Arvores
ctx.drawImage(arvores_mandala,tx, ty);
}
}
tijolos = new Image()
tijolos.src = "tijolos.png"
colunas = function(ctx, x1, y1, tamanho, angulo, poda, stroke)
{
var senCos= getSenCos(angulo)
var tx = x1+tamanho*senCos[0]
var ty = y1+tamanho*senCos[1]
ctx.lineWidth = 1;
ctx.beginPath();
r = 0.5;
if( poda>1 )
{
// momento em que acrescentamos novos ramos (Novas somas)
colunas (ctx, tx, ty, tamanho*r, angulo+90,poda-1 , stroke)
colunas (ctx, tx, ty, tamanho*r, angulo, poda-1 , stroke)
colunas (ctx, tx, ty, tamanho*r, angulo-90,poda-1 , stroke)
arvores (ctx, tx, ty, tamanho*r, angulo+180,poda-2 , stroke)
}
else
{
//tijolos
ctx.drawImage(tijolos,tx, ty);
}
}
mandala = function(t)
{
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
//filhos
colunas (ctx, 320, 320, 228, 0+45 , t, "#FF0000");
colunas (ctx, 320, 320, 228, 90+45 , t, "#FF0000");
colunas (ctx, 320, 320, 228, 180+45 , t, "#FF0000");
colunas (ctx, 320, 320, 228, 270+45 , t, "#FF0000");
}
gramado = function( color )
{
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle=color;
ctx.fillRect(0,0,660,660);
}
load = function()
{
gramado ("#006600")
mandala(5)
}
</script>
</head>
<body onload="load();">
<canvas id="myCanvas" width="660" height="660" style="border:1px solid #000000;">
</canvas>
</body>
</html>
Angkor camboja:
Nenhum comentário:
Postar um comentário