Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

por favor, alguém pode avaliar o meu código????

<canvas width="800" height="600"></canvas>
<script>

var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');


function pintaRetangulo(cor, x, y, largura, altura) {
   pincel.fillStyle = cor;
    pincel.fillRect(x, y, largura, altura);
}

function pintaTriangulo (cor, ponta1, linha1, ponta2, linha2, ponta3, linha3) {
  pincel.fillStyle = cor
      pincel.beginPath();
          pincel.moveTo(ponta1, linha1);
              pincel.lineTo(ponta2, linha2);
                  pincel.lineTo(ponta3, linha3);
                      pincel.fill();
    }

 pintaRetangulo('darkgreen', 25, 25, 750, 550);


     pintaTriangulo('yellow', 100, 275,400,100,700,275);
     pintaTriangulo('yellow', 100, 275, 700,275, 400, 500);




pincel.fillStyle = 'darkblue';
pincel.beginPath();
pincel.arc(400, 290, 120, 0, 2*6.22);
pincel.fill();

</script>
4 respostas

Olá Karina, tudo bem? Seu código está muito bom pra quem começou agora. Eu ajustaria apenas os espaços e continuaria estudando. Tem algumas coisas que podemos melhorar.

Exemplo: da mesma forma que você passa as cores para a função e os pontos onde o traço deve ser pintado, passar também o pínsel. Assim você sempre terá a garantia que a função tem tudo que precisa para executar o seu trabalho corretamente.

solução!

Detalhe: pincel.fillStyle = cor falta um ; fechando essa linha.

Instale o http://www.atom.io para te ajudar a deixar o código mais legível (indentado).

Muito obrigada a todos.Estou gostando muito de tudo isso aqui, é como fazer artesanato com papelão, tinta, só que usando matemática e a bendita lógica.

obrigada pela indicação do atom.io

abraço,

Será ainda mais divertido quando aplicar uma linguagem de programação em cima do HTML/CSS... bons estudos, Karina!