Diâmetro ou raio?

Olá, Letícia! Tudo bem contigo? Espero que sim!

Ao usar o diâmetro

let diametro = 15;

estamos nos referindo ao tamanho dessa bolinha, de uma extremidade a outra.

Já a utilização do raio

let raio = diametro / 2;

nos referimos qual o tamanho do centro dessa bolinha até a extremidade.

Até aí, tudo bem?

No projeto, o ponto é contabilizado quando toda a bolinha ultrapassa o limite estabelecido na função marcaPonto quando estabelecemos o diâmetro como referência

colidiu = collideRectCircle(x,y,raqueteLargura,raqueteAltura,xBolinha,yBolinha,diametro);

Ao utilizar o raio como referência, o ponto é contabilizado ao passar metade da bolinha.

function marcaPonto(){
  if (xBolinha>590){
    meusPontos+=1;
    ponto.play();
  }
  if (xBolinha<10){
    pontosOponente+=1;
    ponto.play();
  }
}

Como teste, reduza a velocidade da bolinha e verá que utilizando raio ela entra em um bug grudando na raquete. Já o diâmetro pode ser que contabiliza mais de um ponto ao tocar a margem. É um problema do próprio site? Pode ser sim, sendo que na velocidade acima de 4, comigo, o comportamento foi como esperado. Não houve erro!

Outro ponto, pode ser que utilizando raio ou diâmetro alteremos alguns dados no tamanho da bolinha, distância da raquete e a margem ou alguma outra medida.

Agradeço pela sua dúvida, Letícia. Tenho certeza que vai abrir margens para outros alunos estudarem diversas formas de codificar dentro da plataforma p5js.

Até breve, Letícia!

Bons estudos e vamos em frente!

O código da biblioteca p5.collide2d.js para a função collideRectCircle é dado a seguir:

p5.prototype.collideRectCircle = function (rx, ry, rw, rh, cx, cy, diameter) {
  //2d
  // temporary variables to set edges for testing
  var testX = cx;
  var testY = cy;

  // which edge is closest?
  if (cx < rx){         testX = rx       // left edge
  }else if (cx > rx+rw){ testX = rx+rw  }   // right edge

  if (cy < ry){         testY = ry       // top edge
  }else if (cy > ry+rh){ testY = ry+rh }   // bottom edge

  // // get distance from closest edges
  var distance = this.dist(cx,cy,testX,testY)

  // if the distance is less than the radius, collision!
  if (distance <= diameter/2) {
    return true;
  }
  return false;
};

Percebe-se que a função trabalha com diâmetro, não com raio.