Nada

<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);

    var cores = ['blue', 'red', 'green'];
    var i = 0
    var r = 10 

                function desenhaCirculoAoClicar (evento) {

                    if (evento.shiftKey){
                        r = 20
                    } else {
                        r = 10
                    }

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

                pincel.fillStyle = cores[i];
                pincel.beginPath ();
                pincel.arc (x, y, r, 0, 2* 3.14);
                pincel.fill ();

                console.log (x + ', ' + y)

            }
    tela.onclick = desenhaCirculoAoClicar

            function mudaCor () {
                i++
                    if (i >= cores.length){
                        i = 0
                    }                            
            }    
    tela.oncontextmenu = mudaCor;   





</script>