Caro Instrutor!
Como utilizo a função arc para desenhar metade de uma bola para cima e outra bola metade para baixo, tipo arquitetura de Brasília, do Congresso Nacional.
No aguardo.
Caro Instrutor!
Como utilizo a função arc para desenhar metade de uma bola para cima e outra bola metade para baixo, tipo arquitetura de Brasília, do Congresso Nacional.
No aguardo.
Olá Eberson,
como foi dito na aula, os primeiros dois parâmetros do método arc são as coordenadas X e Y do centro do círculo, o terceiro parâmetro é o valor do raio e o quarto e quinto parâmetros definem o ângulo inicial e final do círculo.
No caso, o ângulo é dado em números radianos, que vão de 0 a 2*3.14 (equivalente a 360º). Ou seja, como queremos que o círculo varra apenas metade do círculo (180º), vamos então de 0 a 1*3.14.
pincel.arc(100, 100, 50, 0, 1*3.14);Como o próximo arco começa em 180º e vai até o zero novamente, temos os mesmos parâmetros, porém na ordem inversa:
pincel.arc(200, 100, 50, 1*3.14, 0);Além disso, alteramos o primeiro parâmetro para deslocar o nosso arco 100 unidades para a direita.
No final, o código inteiro fica assim:
<canvas id="tela" width="600" height="400"></canvas>
<script>
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');
pincel.beginPath();
pincel.arc(100, 100, 50, 0, 1*3.14);
pincel.arc(200, 100, 50, 1*3.14, 0);
pincel.fill();
</script>