円同士が衝突したときにモンストのような反射の挙動をしてほしい

Question

実現したいこと

円同士が衝突したときにモンストのような反射の挙動をしてほしい

前提

Processingでモンストのようなゲームを作っています。

発生している問題・エラーメッセージ

衝突したときにめり込んだ影響で、振動してしまってうまく反射してくれない。

該当のソースコード

//dx,dyをvelocityに変更した影響でdx,dyがコメントアウトがしてあります
class Chara {
  float[][] position = new float[4][2];
  float[] dx = new float[4];
  float[] dy = new float[4]; 
  float[][] velocity=new float[4][2];
  float[] start_x = new float[4]; 
  float[] start_y = new float[4]; 
  float[] speed = new float[4]; 
  int[] attack = new int[4];
  int[] HP = new int[4];
  int allHP;
  int currentHP;
  int damage;
  float r = 80; 
  boolean[] isDrag = new boolean[4]; 
  boolean[] isStopped = new boolean[4]; 
  
  int currentPhase;
  int nowCP;

  Chara() {
    nowCP=0;
      currentPhase = 0;
    for (int i = 0; i < 4; i++) {
      position[i][0] = (i + 1) * 128;
      position[i][1] = 600;
     // dx[i] = 0;
      velocity[i][0]=0;
    //  dy[i] = 0;
      velocity[i][1]=0;
      start_x[i] = 0;
      start_y[i] = 0;
      speed[i] = 30;
      attack[i]=30000;
      HP[i]=25000;
      allHP+=HP[i];
      isDrag[i] = false;
      isStopped[i] = false;
    }
    currentHP=allHP;
  }
  
  void update() {
    switch (nowCP) {
    case 0:
      updateBall(0);
      break;
    case 1:
      updateBall(1);
      break;
    case 2:
      updateBall(2);
      break;
    case 3:
      updateBall(3);
      break;
    }
  }
  
  
  void updateBall(int index) {
//  dx[index] *= 0.99;
//  dy[index] *= 0.99;
  velocity[index][0]*=0.99;
  velocity[index][1]*=0.99;

  if (abs(velocity[index][0]) < 0.5 && abs(velocity[index][1]) < 0.5) {
    velocity[index][0] = 0;
    velocity[index][1] = 0;
    stop(index);
  }  
  move(index, position[index][0], position[index][1], velocity[index][0], velocity[index][1]);
  bound(index, position[index][0], position[index][1]);

}

  void display() {
   showChara();
   showArrow();
   showHP();
  }



  void mousePressed() {
    
  if (scene_number == SCENE_GAME&&isStopped[nowCP]&&!m.phase) {
    nowCP=currentPhase;
    currentPhase++;
    if (currentPhase >= 4) {
      currentPhase = 0;
    }
  }
  if(!m.phase){
    start_x[nowCP] = mouseX;
    start_y[nowCP] = mouseY;
    isDrag[nowCP] = true;
  }
}


  void mouseReleased() {
  if (scene_number == SCENE_GAME && isStopped[nowCP]&&!m.phase) {
    resume(nowCP); 
    m.phase=true;
    arrow(position[nowCP][0], position[nowCP][1], start_x[nowCP], start_y[nowCP]);
    float l = mag(start_x[nowCP] - mouseX,start_y[nowCP] - mouseY);

    //dx[nowCP] = (start_x[nowCP] - mouseX) * speed[nowCP]/l;
   // dy[nowCP] = (start_y[nowCP] - mouseY) * speed[nowCP]/l;
    velocity[nowCP][0] = (start_x[nowCP] - mouseX) * speed[nowCP]/l;
    velocity[nowCP][1] = (start_y[nowCP] - mouseY) * speed[nowCP]/l;
    isDrag[nowCP] = false;

    if (l < r/2) {
     // dx[nowCP] = 0;
     // dy[nowCP] = 0;
      velocity[nowCP][0]=0;
      velocity[nowCP][1]=0;
      currentPhase--;
      m.phase=false;
    }
  }
}
void showChara(){
  fill(0);
    for (int i = 0; i < 4; i++) {
      strokeWeight(1);
      stroke(0);
      circle(position[i][0], position[i][1], r);
      fill(63*i);    
    }
  //  text(nowCP,width/2,height/2,0);
}

void showArrow(){
  for (int i = 0; i < 4; i++) {
  if (isDrag[i]) {
        arrow(position[i][0], position[i][1], start_x[i], start_y[i]);
      }
  }
}
void arrow(float x, float y, float start_x, float start_y) {
  PVector arrow = new PVector(x + start_x - mouseX, y + start_y - mouseY);
  if (isStopped[nowCP]) {
    stroke(0);
    strokeWeight(10);
    line(arrow.x, arrow.y, x, y);
    
  }
}

void showHP(){
  float HPbar;
  HPbar=map(currentHP,0,allHP,0,width);
  textSize(50);
  strokeWeight(10);
  stroke(255,255,0);
  line(0,height,HPbar,height);
  textAlign(RIGHT);
  text(allHP,width,height);
  textAlign(LEFT);
  text("/",width-155,height);
  textAlign(RIGHT);
  text(currentHP,width-150,height);
}



  void bound(int index, float x, float y) {
    boolean collision[]=new boolean[6];
    for(int i=0;i<m.M;i++){
      if(m.HP[i]>=0){
      collision[i]=false;
      }
    }
    
    if (x > width && velocity[index][0] > 0) {
      //dx[index] *= -1;
      velocity[index][0]*=-1;
    }
    if (x < 0 && velocity[index][0] < 0) {
     // dx[index] *= -1;
      velocity[index][0]*=-1;
    }
    if (y > height && velocity[index][1] > 0) {
     // dy[index] *= -1;
      velocity[index][1]*=-1;
    }
    if (y < 0 && velocity[index][1] < 0) {
      //dy[index] *= -1;
      velocity[index][1]*=-1;
    }
    
  for(int i=0;i<m.M;i++){
    if(m.HP[i]>=0){
      
      float d=distance(m.position[i][0],m.position[i][1],x,y);
      if(d<r/2+m.r/2){
        collision[i]=true;
        text("collision",width/2,100);
        if(abs(velocity[index][0])>=abs(velocity[index][1])&&collision[i]){
          velocity[index][0] *= -1;
          m.HP[i]-=attack[nowCP];
        }
        if(abs(velocity[index][0])<abs(velocity[index][1])&&collision[i]){
          velocity[index][1]*=-1;  
          m.HP[i]-=attack[nowCP];
        }
      }
    }
   }
 }
 
  
float distance(float x1, float y1, float x2, float y2) {
  float dx = x2 - x1;
  float dy = y2 - y1;
  return sqrt(dx * dx + dy * dy);
}

  void move(int index, float x, float y, float dx, float dy) {
    position[index][0] = x + dx;
    position[index][1] = y + dy;
  }



  void stop(int index) {
    isStopped[index] = true;
    
  }

  void resume(int index) {
    isStopped[index] = false;
  }
}

試したこと

bound関数の中身をずっといじっているのですが見当違いなのでしょうか？

補足情報（FW/ツールのバージョンなど）

Processing 4.2

Comments

[jimbe]

>衝突したときにめり込んだ影響で、振動してしまってうまく反射してくれない

それで、そのコードで何が問題なのでしょうか。
結果として「反射したように表示がされない」こととコードと何の関係がありますか。
例え何かを求める式が正常だったとしても、どう表示するか・どう表示に用いるかで結果は異なるのでは無いでしょうか。
"めり込み"が原因なら"めり込まないようにする"というのが対処としてまずあると思いますが、如何でしょうか。

[jimbe]

まだ全体像が見えませんので想像ですが、 updateBall で個々の動きを更新する際に、それぞれが個別に衝突判定・計算をするためではないでしょうか。本来(?)衝突は同時に起き同時に双方に変化を起こすはずです。
お互いが動き、結果衝突が発生してお互いが向きを逆にし、かつ次の move で確実にお互いが衝突状態にならないように position もしくは dx/dy の値を決めるとか衝突フラグ等を持たせるとかが考えられると思います。

[HERO]

解答ありがとうございます。
なんとなくおっしゃっていることはわかりますが、理解力が低く、具体的な解決策が思いつきませんでした、、、
「衝突フラグを持たせる」が解決できそうだと思いやってみたんですが変わらずでした…

Answer 1

衝突したときにめり込んだ影響で、振動してしまってうまく反射してくれない。

コードが不完全で実行できませんが、こういうことですよね？（質問者のほうで再現可能な最小サンプルを提供してください）

bound関数の中身をずっといじっているのですが見当違いなのでしょうか？

というかdxかdyを反転しているだけなので、めり込み以前に円同士の反射になっていませんよね？（矩形相手の反射）
法線がどうのこうの計算が必要なのではないですか？（わたしはさっぱりわかりませんが^^;
反射・壁ずり・鏡像ベクトルの考え方

PVector position = new PVector(50, 350);
PVector m_position = new PVector(200, 200);
PVector velocity = new PVector();
float r = 30;
float m_r = 50;

PVector sp, ep;
boolean mode = true;

void setup() {
  size(400, 400);
  ellipseMode(RADIUS);
}

void draw() {
  background(255);

  fill(mode ? #ff0000 : #0000ff);
  circle(m_position.x, m_position.y, m_r);

  if (sp != null) {
    var p = PVector.add(position, PVector.sub(sp, ep));
    line(position.x, position.y, p.x, p.y);
  }

  updateBall();
  showChara();
}

void updateBall() {
  velocity.mult(0.99);
  if (velocity.mag() < 0.5) {
    velocity.set(0, 0);
  }

  move();
  bound();
}

void showChara() {
  fill(0);
  circle(position.x, position.y, r);
}

void bound() {
  var x = position.x;
  var y = position.y;

  if (x > width && velocity.x > 0)  velocity.x *= -1;
  if (x < 0 && velocity.x < 0)      velocity.x *= -1;
  if (y > height && velocity.y > 0) velocity.y *= -1;
  if (y < 0 && velocity.y < 0)      velocity.y *= -1;

  var d = position.dist(m_position);
  if (d < r + m_r) {
    if (mode) {

      // オリジナル
      if (abs(velocity.x) >= abs(velocity.y)) {
        velocity.x *= -1;
      } else {
        velocity.y *= -1;
      }
    } else {

      // 円の反射
      var n = PVector.sub(position, m_position);
      n.normalize();
      var length = PVector.mult(velocity, -1).dot(n);
      var de = n.mult(length);
      var dh = PVector.add(velocity, de.mult(2));
      velocity = dh;
    }
  }
}

void move() {
  position.add(velocity);
}

void mousePressed() {
  sp = new PVector(mouseX, mouseY);
  ep = sp.copy();
}
void mouseDragged() {
  ep.set(mouseX, mouseY);
}
void mouseReleased() {
  velocity.set(sp.sub(ep).div(10));
  sp = ep = null;
}
void mouseClicked() {
  if (mouseButton == RIGHT) mode = !mode;
}

PVector / Reference / Processing.org

---

これでもめり込み問題は残ります（円周にくっつくような挙動）
そもそもめり込まないようにするのがいいんじゃないですかね？（めり込み量はわかってるんで雑に離すだけでも効果ある？）
円同士を重ならない位置まで補正する

どちらの円も動くような場合はこちら。
動く円と円の衝突と反発ベクトルの求め方

---

わたしだったら難しいことを考えたくないので、fisicaかなんかで作ると思います（別の難しさはありますが^^;

追記

円の反射についてですがモンストでは基本的には単純に向きを反転する反射をします。
なのでその点については気にしなくて大丈夫です！

なるほど反射はdx・dyの大きいほう（＝角度）で決まるのですね。

重ならない位置まで補正すればうまく解決しそうなのはわかるのですが、うまくできないのが現状です…

押し出すような手法もあると思いますが、面倒なので向きと位置で反射するかどうかを判断するのはどうでしょう？

現状↓のような状態でめり込みが発生しています。

青い線のところで反射しないようにすれば、そのまま抜けて連続反射にはならなくなりますね？

PVector position = new PVector(50, 350);
PVector m_position = new PVector(200, 200);
PVector velocity = new PVector();
float r = 30;
float m_r = 50;

PVector sp, ep;


void setup() {
  size(400, 400);
  ellipseMode(RADIUS);
}

void draw() {
  background(255);

  fill(#ff0000);
  circle(m_position.x, m_position.y, m_r);

  if (sp != null) {
    var p = PVector.add(position, PVector.sub(sp, ep));
    line(position.x, position.y, p.x, p.y);
  }

  updateBall();
  showChara();
}

void updateBall() {
  velocity.mult(0.99);
  if (velocity.mag() < 0.5) {
    velocity.set(0, 0);
  }

  move();
  bound();
}

void showChara() {
  fill(0);
  circle(position.x, position.y, r);
}

void bound() {
  var x = position.x;
  var y = position.y;

  if (x > width && velocity.x > 0)  velocity.x *= -1;
  if (x < 0 && velocity.x < 0)      velocity.x *= -1;
  if (y > height && velocity.y > 0) velocity.y *= -1;
  if (y < 0 && velocity.y < 0)      velocity.y *= -1;

  var d = position.dist(m_position);
  if (d < r + m_r) {
    if (abs(velocity.x) >= abs(velocity.y)) {
      
      // 右向きに進んでいて、自分が相手より左にいるなら反射
      if (0 < velocity.x && x < m_position.x) {
        velocity.x *= -1;
      }
      // 左向きに進んでいて、自分が相手より右にいるなら反射
      if (velocity.x < 0 && m_position.x < x) {
        velocity.x *= -1;
      }
    } else {
      if ((0 < velocity.y && y < m_position.y) ||
        (velocity.y < 0 && m_position.y < y)) {
        velocity.y *= -1;
      }
    }
  }
}

void move() {
  position.add(velocity);
}

void mousePressed() {
  sp = new PVector(mouseX, mouseY);
  ep = sp.copy();
}
void mouseDragged() {
  ep.set(mouseX, mouseY);
}
void mouseReleased() {
  velocity.set(sp.sub(ep).div(10));
  sp = ep = null;
}

かすったような時に、すり抜けは発生するかな？（当たり判定がやや小さくなる）

Comments

[HERO]

解答ありがとうございます。
憶測通り再現動画のようになっています。
円の反射についてですがモンストでは基本的には単純に向きを反転する反射をします。
なのでその点については気にしなくて大丈夫です！
重ならない位置まで補正すればうまく解決しそうなのはわかるのですが、うまくできないのが現状です…

[TN8001]

回答に追記しました^^

[HERO]

ありがとうございます！
概ね希望の挙動をしてくれるようになりました！
ベストアンサーにさせていただきます

Answer 2

[香車]東上☆あらし☆海美「刻み幅を 1/2 にして、2 回計算してから、表示するようにする」