Propuesta de Solución para cambiar el color de los circulos.

<canvas width="600" height="400"></canvas> 

<script> 
      var colores = ["blue","red","green"] //Declaración del arreglo para colores
      var contador = 1; //declaracion de la variable para el cambio de colores en el while

      var pantalla = document.querySelector("canvas"); 
      var pincel = pantalla.getContext("2d"); 

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

      pincel.fillStyle = "blue"; //Estilo de llenado en Azul.

      //En esta funcion ya no mandamos el estilo de llenado
      function dibujarCirculo(evento){
      var x = evento.pageX - pantalla.offsetLeft;
      var y = evento.pageY - pantalla.offsetTop;
      pincel.beginPath();
      pincel.arc(x,y,10,0,2*3.14159);
      pincel.fill();
      console.log(evento);
      }

      function alterarColor() { 
       //While que nos ayuda a llamar el color siguiente en el arreglo, se checa si ya estamos en el ultimo color para regresar al primero, de otra forma amenta un valor en el contador
          while(contador<colores.length){
          pincel.fillStyle = colores[contador];
          if(contador == 2 ){
            contador = 0;
            break;  
              }else{
            contador++;
            break;  
              }
            }
      return false; 
      }   

      pantalla.onclick = dibujarCirculo;
      pantalla.oncontextmenu = alterarColor;

</script>