我目前正在使用p5.js编写一个吃豆人克隆，并遇到了一个问题。我创建了一个函数，它通过使用多维数组绘制地图，绘制一个1是的墙块，而0是什么。
这很好用，但是我很难发现玩家和墙壁之间的碰撞。我试图使用for循环遍历数组，检查x和y坐标以查看是否存在冲突，但它根本没有注册。这是我用来检测碰撞的代码：
for(i=0;i<walls.length;i++){
walls[i].draw();
if(player.x > walls[i].x && player.x < walls[i].x + gridsize && player.y > walls[i].y && player.y < walls[i].y + gridsize){
console.log('collision')
}
}
我无法看到问题出在哪里，因为它似乎在其他程序中有效。 它在Draw（）函数中运行，这意味着它每秒循环30次。
这是完整的代码，问题出在其他地方：
var gridsize = 20;
var walls = [];
var dots = [];
var player;
var score =0;
var maps = [[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1],
[1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1],
[1,0,1,1,0,1,1,1,1,1,1,0,1,1,0,1],
[1,0,1,1,0,0,0,0,0,0,0,0,1,1,0,1],
[1,0,0,0,0,1,1,1,1,1,1,0,0,0,0,1],
[1,1,1,1,0,0,0,0,0,0,0,0,1,1,1,1],
[1,0,0,0,0,1,1,0,0,1,1,0,0,0,0,1],
[1,0,1,0,0,1,0,0,0,0,1,0,0,1,0,1],
[1,0,1,0,0,1,0,0,0,0,1,0,0,1,0,1],
[1,0,1,0,0,1,1,1,1,1,1,0,0,1,0,1],
[1,0,1,0,0,0,0,2,0,0,0,0,0,1,0,1],
[1,0,1,1,1,0,1,1,1,1,0,1,1,1,0,1],
[1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1],
[1,0,0,0,1,1,1,1,1,1,1,1,0,0,0,1],
[1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1],
[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1]];
function setup(){
createCanvas(320,320);
frameRate(30);
createMap();
}
function draw(){
background(51);
for(i=0;i<walls.length;i++){
walls[i].draw();
if(player.x > walls[i].x && player.x < walls[i].x + gridsize && player.y
> walls[i].y && player.y < walls[i].y + gridsize){
console.log('collision')
}
}
fill('white');
text('Score: ' + score, 5,10);
for(i=0;i<dots.length;i++){
if(player.x == dots[i].x && player.y == dots[i].y && dots[i].collect ==
false){
dots[i].collect = true;
score++;
}
dots[i].draw();
}
player.update();
player.draw();
}
function Block(x,y){
this.x = x;
this.y = y;
this.draw = function(){
fill('black');
rect(this.x,this.y,gridsize,gridsize);
}
}
function Dot(x,y){
this.x = x;
this.y = y;
this.collect = false;
this.draw = function(){
if(!this.collect){
fill('yellow');
ellipse(this.x+gridsize/2,this.y+gridsize/2,gridsize/3,gridsize/3);
}else if(this.collect){
noFill();
noStroke();
ellipse(this.x+gridsize/2,this.y+gridsize/2,gridsize/3,gridsize/3);
}
}
}
function Player(x,y){
this.x = x;
this.y = y;
this.update = function(){
if(keyIsDown(UP_ARROW) && frameCount%5 == 0){
player.y -= gridsize;
}
if(keyIsDown(DOWN_ARROW) && frameCount%5 == 0){
player.y += gridsize;
}
if(keyIsDown(LEFT_ARROW) && frameCount%5 == 0){
player.x -= gridsize;
}
if(keyIsDown(RIGHT_ARROW) && frameCount%5 == 0){
player.x += gridsize;
}
}
this.draw = function(){
fill('blue');
ellipse(this.x+gridsize/2,this.y+gridsize/2,gridsize/1.2,gridsize/1.2);
}
}
function createMap(){
for(i=0;i<maps.length;i++){
for(j=0;j<maps[i].length;j++){
if (maps[i][j] == 1){
walls.push(new Block(j*gridsize,i*gridsize));
}else if(maps[i][j] == 0){
dots.push(new Dot(j*gridsize,i*gridsize))
}else if(maps[i][j] = 2){
player = new Player(j*gridsize,i*gridsize)
}
}
}
}
我认为问题在于墙存储在一个数组中，但是我已经完成了非常相似的程序，其中相同的代码可以工作。
答案 0 :(得分：2)
检查此类地图的最佳方法是使用播放器的输入。
玩家必须与墙壁对齐，因此假设玩家位置相对于左上角而玩家是一个宽而深的地图单位。
键输入请求移动方向dx，dy按住一次可能超过一个的方向。如果dx或dy不为0，则首先检查玩家是否排列了一个段落，如果是，则检查块是否在行进方向。如果玩家没有排队或阻挡，则将移动变量设置为0
检查x和y方向后，如果dx或dy有值，则必须是有效的移动。
从主循环中删除玩家碰撞检查代码，并使用当前地图作为2D原始版本调用玩家更新功能。
player.update(maps); // move the player
更改播放器和更新功能
function Player(x,y){
this.x = x;
this.y = y;
var dx = 0; // hold current movement
var dy = 0;
const speed = 1; // per Frame pixel speed best as an integer (whole number) and evenly divisible into gridSize
// need the map so that must be passed to the update function
this.update = function(map){
// assuming keys are held to move up to stop
dx = 0; // stop by default
dy = 0;
if (keyIsDown(UP_ARROW)) { dy = -speed }
if (keyIsDown(DOWN_ARROW)) { dy = speed }
if (keyIsDown(LEFT_ARROW)) { dx = -speed }
if (keyIsDown(RIGHT_ARROW)){ dx = speed }
// get player map coords
var x = Math.floor(this.x / gridSize); // get map coord
var y = Math.floor(this.y / gridSize); // get map coord
// the two if statement are best aas function
// so you can select which one to call first. Depending on the latest
// new keys down and if the result allows movement in that
// direction then set the other direction to zero.
if (dy !== 0) { // is moving up or down?
if (this.y % gridsize === 0) { // only if lined up
if (dy > 0){ // is moving down
if (map[y + 1][x] === 1) { // down blocked
dy = 0;
}
}else if (map[y - 1][x] === 1) { // up blocked
dy = 0;
}
} else { // block move if not lined up with passage
dy = 0;
}
}
if(dx !== 0){ // is moving left or right?
if (this.x % gridsize === 0) { // only if lined up
if (dx > 0) { // is moving right
if (map[y][x + 1] === 1) { // right blocked
dx = 0;
}
} else if (map[y][x - 1] === 1) { // left blocked
dx = 0;
}
} else { // block move if not lined up with passage
dx = 0;
}
}
// could have two moves, but can only move left right or up down
// you need to add some input smarts to pick which one
// this just favours up down
if(dy !== 0) { dx = 0 };
// only valid moves will come through the filter above.
// so move the player.
this.x += dx;
this.y += dy;
}
注意我已经改变了玩家移动的方式，我设置了每帧的速度（1像素），它必须是gridSize的偶数除数。
上面的代码是最简单的实现。这种类型的游戏需要一些额外的智能控件。您应该检查最新键的方向。即如果按下向右和向右行进的玩家，那么向右移动应该具有优先权。如果按下左右移动的玩家，则应向左移动，而不是继续向右移动。
在看这个问题时，我想要想象地图。作为数组的映射很难创建和修改，并且很难找到错误。作为一组在运行时转换为数组的字符串会更容易。
因为我完成了转换，所以没有浪费它。 maps与原始数组相同，但现在更容易阅读和更改。
const maps = [
"################",
"# #",
"# ## ###### ## #",
"# ## ## #",
"# ###### #",
"#### ####",
"# ## ## #",
"# # # # # #",
"# # # # # #",
"# # ###### # #",
"# # 2 # #",
"# ### #### ### #",
"# #",
"# ######## #",
"# #",
"################"
].map(row => row.split("").map(c => c === "#" ? 1 : c === " " ? 0 : 2));
答案 1 :(得分：1)
当您可以使用基于网格的碰撞检测时，我不太确定您为什么要使用矩形 - 矩形碰撞检测。你可以直接使用数组。
但是由于你使用矩形 - 矩形碰撞，这条线看起来有点偏离：
order您要检查播放器的左边缘是否在墙内，以及播放器的上边缘是否在墙内。但是你没有检测到其他边缘。通常你想做这样的事情：
if(player.x > walls[i].x && player.x < walls[i].x + gridsize && player.y > walls[i].y && player.y < walls[i].y + gridsize){
注意这个if(rectOneRight > rectTwoLeft && rectOneLeft < rectTwoRight && rectOneBottom > rectTwoTop && rectOneTop < rectTwoBottom){
语句如何检查所有边缘，而不仅仅是顶部和左边。但就像我说的那样，你可能最好只使用网格碰撞检测，因为你已经有了网格。
无耻的自我推销：here是关于碰撞检测的教程。它是为Processing编写的，但所有内容都应该直接转换为P5.js。
答案 2 :(得分：0)
如果玩家不是精灵，那么此处的点对点碰撞检测将是合适的。
genetator_filter = genetator_filter = ((a,b) for a,b in rec_Dict.iteritems() if (not '.0015' in a) and (not '000000000500test.' in a) )
#(you need to fix filter conditions for keys)
print 'max:' + str(max(genetator_filter, key = lambda x:x[1]))