Cambiando de color

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

<script>
    let pantalla = document.querySelector("canvas"); //conecta con la pizarra que está en HTML
    let pincel = pantalla.getContext("2d"); //traer todo el contenido que está en la pizarra de viene de HTML

    pincel.fillStyle = "grey"; //pintamos el fondo de la pizarra
    pincel.fillRect(0, 0, 600, 400); //dibujar un rectangulo. Iniciamos desde la parte superior izquierda y hacemos el rectangulo del mismo tamaño de la pizarra

    let colores = ["blue", "red", "green"];
    let colorActual = 0;

    pantalla.onclick = dibujarCirculo; //Aparece un circulo con borde negro
    pantalla.oncontextmenu = alterarColor; //Cambiar de color

    //FUNCIONES
    function dibujarCirculo(evento) {
        let x = evento.pageX - pantalla.offsetLeft;
        let y = evento.pageY - pantalla.offsetTop;
        pincel.fillStyle = colores[colorActual];
        pincel.beginPath();
        pincel.arc(x, y, 10, 0, 2 * Math.PI);
        pincel.fill();

        console.log(x + "," + y);
    }
    function alterarColor() {
        colorActual++;
        color = colores[colorActual];
        if (colorActual == colores.length) {
            colorActual = 0;
        }
        return false; //esto no hace aparecer el recuadro de dialogo de Windows al dar click derecho
    }
</script>