Disparando contra el objetivo

Comparto mi codigo de lo visto en la clase, cambie las condiciones del if para saber si acertamos al blanco, ya que con las condiciones dadas se considera un area cuadrada alrededor del punto aleatorio, pero el blanco es un circulo. Solo hice una funcion para calcular la distancia entre el punto aleatorio y el punto donde damos click, si es menor o igual al radio del circulo entonces acertamos.

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

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

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

    var radio = 10;
    var xAleatorio;
    var yAleatorio;

    function diseniarCicunferencia(x, y, radio, color) {
        pincel.fillStyle = color;
        pincel.beginPath();
        pincel.arc(x, y, radio, 0, 2*Math.PI);
        pincel.fill();
    }

    function limpiarPantalla() {
        pincel.clearRect(0, 0, 600, 400);
    }

    function diseniarObjetivo(x, y) {
        diseniarCicunferencia(x, y, radio + 20, "red");
        diseniarCicunferencia(x, y, radio + 10, "white");
        diseniarCicunferencia(x, y, radio, "red");
    }

    function sortearPosicion(maximo) {
        return Math.floor(Math.random()*maximo);
    }


    var x = 0;
    function actualizarPantalla() {
        limpiarPantalla();

        xAleatorio = sortearPosicion(600);
        yAleatorio = sortearPosicion(400);
        diseniarObjetivo(xAleatorio, yAleatorio);

    }

    setInterval(actualizarPantalla, 1000);

    function distEntre2Puntos(x1, y1, x2, y2) {
        return Math.sqrt(Math.pow(x2-x1, 2) + Math.pow(y2-y1, 2));
    }

    function disparar(e) {

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

        if(distEntre2Puntos(xAleatorio, yAleatorio, x, y) <= radio) {
            alert("Tiro certero");
        }
    }

    pantalla.onclick = disparar;

</script>