Entrar Ainda não tem acesso?
2
respostas

Oi, galera! Alguém poderia me explicar esse código? (Faz parte da atividade do curso de lógica de programação 2)

Referente ao curso JavaScript e HTML: pratique lógica com desenhos, animações e um jogo, no capítulo Extraindo funções e atividade Uma inofensiva flor…

por Tamires Paulino Chaves
| 32.3k xp | 17 posts
<canvas width="600" height="400"></canvas>

<script>

    var tela = document.querySelector('canvas');
    var pincel = tela.getContext('2d');
    pincel.fillStyle = 'lightgray';
    pincel.fillRect(0, 0, 600, 400);

    function desenhaCirculo(x, y, raio, cor) {

        pincel.fillStyle = cor;
        pincel.beginPath();
        pincel.arc(x, y, raio, 0, 2 * Math.PI);
        pincel.fill();
    }

    function desenhaFlor(x, y) {
        desenhaCirculo(x, y+20, 10, 'blue');
        desenhaCirculo(x, y, 10, 'red');
        desenhaCirculo(x, y-20, 10, 'yellow');
        desenhaCirculo(x-20, y, 10, 'orange');
        desenhaCirculo(x+20, y, 10, 'black');
    }

        desenhaFlor(300, 200);

</script>
2 respostas
por Daniella Malvar De Azevedo Matos
| 157k xp | 148 posts
Supervisora de Serviço

Olá Tamires.

Não sei se sua dúvida é em relação a função desenhaFlor, mas pelo que entendi como temos círculos no meio, ao lado, acima e abaixo temos que somar e diminuir o diâmetro do círculo ( D = 2 * raio = 20), tanto no eixo x como no eixo y, por exemplo:

  • desenhaCirculo(x, y+20, 10, 'blue') - estaria colocando o círculo com centro em x = 300 e y = 220
por Valéria Francieli Duarte
| 36.9k xp | 6 posts
Administradora

Bom dia Tamires, Achei bem confuso esse código, não entendi nada!! Conseguiu entender sanar a sua dúvida???