Fiz o meu assim

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

    <script type="text/javascript">

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

        var cores = ['blue', 'red','green'];
        var corAtual = 0; 


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

        function desenhaCirculo(evento){
            var x = evento.pageX - tela.offsetLeft;
            var y = evento.pageY - tela.offsetTop;;
            pincel.fillStyle = cores[corAtual];
            pincel.beginPath();
            pincel.arc(x,y,10,0,2*3.14);
            pincel.fill();
            console.log(x+','+y);


    }
        tela.onclick = desenhaCirculo;

        function mudaCor(){

            corAtual++;
                if (corAtual == 3) {
                    corAtual = 0 ;
                }    

            return false;

        }    
        tela.oncontextmenu = mudaCor;    



    </script>