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

Pequeno detalhe que fez meu código não funcionar

Escrevi o código abaixo e não estava desenhando o círculo azul ao clicar:

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

pincel.fillStyle = 'grey';
pincel.fillRect(0, 0, 600, 400);

function desenhaCirculo(evento)    {

    var x = evento.pageX - tela.offsetLeft;
    var y = evento.pageY - tela.offsetTop;

    pincel.fillStyle='blue';
    pincel.beginPath();
    pincel.arc(x, y, 10, 0, 2 * 3,14);
    pincel.fill(); 

    console.log('posição do clique: ' + x + ',' + y);

}



tela.onclick = desenhaCirculo;

Depois de muito tempo revisando percebi que o erro era apenas essa linha:

pincel.arc(x, y, 10, 0, 2 * 3,14);

coloquei uma vírgula no lugar do ponto em 3,14, o correto é 3.14

3 respostas

Obrigado, estava errando no mesmo ponto.

solução!

Sim, com essa vírgula o parênteses passa a conter 6 parâmetros ao invés de 5, que é o correto. Ou seja, o parâmetro (2 * 3.14) é lido como parâmetro (2 * 3) e parâmetro 14.

Acabou de acontecer comigo. Valeu!