<canvas width = "600" height = "400"></canvas>
<script>
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');
pincel.fillStyle = 'lightgrey';
pincel.fillRect(0, 0, 600, 400);
function desenhaCirculo(x, y, raio, cor) {
pincel.fillStyle = cor;
pincel.beginPath();
pincel.arc(x, y , raio, 0, 2*3.14);
pincel.fill();
}
desenhaCirculo(300, 200, 25, 'red');
desenhaCirculo(250, 200, 25, 'orange');
desenhaCirculo(350, 200, 25, 'black');
desenhaCirculo(300, 150, 25, 'yellow');
desenhaCirculo(300, 250, 25, 'blue');
</script>Consegui realizar o exercício de forma correta com a ajuda dos posts do fórum. Minha dúvida é em relação ao 'pincel.arc' e como utilizá-lo corretamente.
Quando utilizo a função desta forma:
desenhaCirculo(300, 200, 0, 2*3.14, 'red')
O código também da certo, porém, o circulo fica minúsculo. Gostaria de entender melhor sobre o 'pincel.arc'. Creio que não entendi muito bem como executá-lo de forma correta.
Desde já, agradeço a quem possa ajudar!
