Cambiando color [Solución con array]

Interando, y corrigiendo mi codigo, solo funcionaba si tenia 3 elementos el array. Corregi sacando el array "colores" a una variable global, y luego pedi el la funcion de cambio de color la longitud, corrigiendo el "if" a cualquier longitud del array. Saludos

<meta charset="UTF-8">

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

<script>
    var pantalla = document.querySelector('canvas');
    var pincel = pantalla.getContext('2d');

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

    var color = 0;
    var colores = ['blue', 'red', 'green'];

    function alterarColor() {
        color++;
        if (color >= colores.length) {
            color = 0;
        }
        return false;
    }


    function dibujarCirculo(evento) {

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



        pantalla.oncontextmenu = alterarColor;

        pincel.fillStyle = colores[color];
        pincel.beginPath();
        pincel.arc(x,y,10,0,2*3.14);
        pincel.fill();
        console.log(x + ' ; ' + y);
    }

    pantalla.onclick = dibujarCirculo;

</script>

Hola Camilo, espero que estés bien!

Gracias por compartir tu solución, felicitaciones! ¡Contenta de que estés practicando y notando errores y corrigiendo, estás ayudando a otros colegas mostrándoles tus prácticas también!

Anexo: el foro se centra en las dudas de contenido y actividad, ¡pero apreciamos sus resultados! Te sugiero que compartas tus resultados en el canal de resultados de tu grupo en lo servidor en Discord.

Mucho éxito en todo lo que te propongas y si tienes alguna duda aquí estaremos para apoyarte.

¡Vamos juntos!