Para quem quiser avaliar.
Espero ter ajudado. Sucesso na sua jornada!!
<canvas width="600" height="400"></canvas>
<script>
var tela = document.querySelector("canvas");
var pincel = tela.getContext ("2d");
pincel.fillStyle = "grey";
pincel.fillRect (0, 0, 600, 400);
function desenharBolinhas (evento) {
var x = evento.pageX - tela.offsetLeft;
var y = evento.pageY - tela.offsetTop;
pincel.fillStyle = colors[i];
pincel.beginPath();
pincel.arc(x , y, 10, 0, 2*3.14);
pincel.fill();
}
tela.onclick = desenharBolinhas;
var colors = ["blue", "red", "green"];
var i = 0;
function mudarCor () {
i = i + 1;
if (i > (colors.length-1)) {
i = 0;
}
return false;
}
tela.oncontextmenu = mudarCor;
</script>