Question

我发现了一个碰撞检测系统，但是现在我试图建立一个系统，这样当调用该函数时，参数中的项目就不会出现。能够互相接触。我是一个相当陌生的JavaScript，它是我第一次尝试学习的语言。我绘制矩形的方式是使x和y位于矩形的中间，而不是在它的左上角。我已经在技术上构建的系统可以工作，但只有当它是一个完美的正方形时，由于某种原因，矩形是错误的，我无法弄明白。即使它是一个完美的正方形，但与我以前相比，它似乎很笨重而且非常糟糕，这是code.org的item1.collide（item2）;它完美而且完全符合我的要求，但我无法找到背后的代码。顺便说一下，我正在使用p5.js。

以下是我如何绘制矩形：

rect(this.x-this.width/2,this.y-this.height/2,this.width,this.height);

这是我目前拥有的blockCollision功能：

function blockCollision(a,b){
    if(a.x+a.width/2 > b.x-b.width/2 &&
    a.x-a.width/2 < b.x+b.width/2 &&
    a.y-a.height/2 < b.y+b.height/2 &&
    a.y+a.height/2 > b.y-b.height/2) {
        if(a.x<b.x-b.width/2) a.x=b.x-b.width/2-a.width/2;
        if(a.x>b.x+b.width/2) a.x=b.x+b.width/2+a.width/2;
        if(a.y<b.x-b.height/2) a.y=b.x-b.height/2-a.height/2;
        if(a.y>b.x+b.height/2) a.y=b.x+b.height/2+a.height/2;
     }
}

此外，如果有帮助，这里是整个代码下载：https://drive.google.com/open?id=0B-F5CHOIQvvGVlR3Njd1M1NLS1E

Answer 1

我假设通过＆＃34;阻止碰撞＆＃34;，你的意思是你想移动＆＃34;对面的＃34;碰撞方向，以便不发生碰撞。

你需要做的就是确定碰撞的方向（上/下/左/右），然后移开有问题的挡块：

function blockCollision(a, b) {
  // Assuming (0, 0) is the top left corner
  const aTop = a.y - a.height / 2;
  const aBottom = a.y + a.height / 2;
  const aLeft = a.x - a.width / 2;
  const aRight = a.x + a.width / 2;

  const bTop = b.y - b.height / 2;
  const bBottom = b.y + b.height / 2;
  const bLeft = b.x - b.width / 2;
  const bRight = b.x + b.width / 2;

  const collisions = [];

  if (aTop <= bTop && aBottom >= bTop) {
    // a is above B, potential collision

    if (aLeft <= bRight && bLeft <= aRight) {
      // Prevent collision, push a to the top
      a.y = bTop - (a.height / 2) - 1;
    }
  }

  if (aBottom >= bBottom && aTop <= bBottom) {
    // a is below B, potential collision

    if (aLeft <= bRight && bLeft <= aRight) {
      // Prevent collision
      a.y = bBottom + (a.height / 2) + 1;
    }
  }

  if (aLeft <= bLeft && aRight >= bLeft) {
    // a is left of B, potential collision

    if (aTop <= bBottom && bTop <= aBottom) {
      // Prevent collision, push a to the left
      a.x = bLeft - (a.width / 2) - 1;
    }
  }

  if (aRight >= bRight && aLeft <= bRight) {
    // a is right of B, potential collision

    if (aTop <= bBottom && bTop <= aBottom) { 
      // Prevent collision, push a to the right
      a.x = bRight + (a.width / 2) + 1;
    }
  }
}

请参阅codepen example。

如何在JavaScript中改进碰撞阻止系统？

1 个答案: