gpt4 book ai didi

javascript - 检测数组中两个 Sprite 的碰撞? JavaScript

转载 作者:行者123 更新时间:2023-11-28 09:09:58 24 4
gpt4 key购买 nike

我一直在阅读/寻找答案来检测两个数组中 Sprite 的碰撞。我不明白如何将两个数组传递到检测函数中并让它相互检查每个数组的所有内容。任何意见将不胜感激。

<script type="text/javascript">

var FIRE = 0;
var NORTH = 38;
var SOUTH = 40;
var EAST = 39;
var WEST = 37;
var destX = 350;
var destY = 500;
var canvas = null;
var context = null;
var sprites = null;
var player = null;
var island = null;
var enemies = [];
var fires = [];
var gameLoopInterval = null;
var offScreenFire = null;
var isShooting = false;
var intersect = null;

var Fire = function() {
this.spriteX = 278;
this.spriteY = 110;
this.spriteWidth = 13;
this.spriteHeight = 16;
this.destX = player.destX + 25;
this.destY = player.destY;
this.speed = 5;
}

var Player = function(name) {
this.name = name;
this.spriteX = 5;
this.spriteY = 400;
this.spriteWidth = 64;
this.spriteHeight = 64;
this.destX = 350;
this.destY = 500;
this.speed = 5;
this.level = 1;
}

var Enemy = function() {

this.spriteX = 4;
this.spriteY = 4;
this.spriteWidth = 32;
this.spriteHeight = 32;
this.destX = Math.ceil(Math.random() * (800 - this.spriteWidth));
this.destY = this.spriteWidth;
this.speed = Math.ceil(Math.random() * 5);
}

var Island = function() {

this.spriteX = 168;
this.spriteY = 500;
this.spriteWidth = 64;
this.spriteHeight = 64;
this.destX = Math.ceil(Math.random() * (800 - this.spriteWidth));
this.destY = this.spriteWidth - 64;
this.speed = 2;
}

Fire.prototype.takeTurn = function() {

var intersect;
var projdestX = this.destX;
var projdestY = this.destY;
var projspriteWidth = this.spriteWidth;
var projspriteHeight = this.spriteHeight;


for (enemy in enemies) {
intersect = intersect || intersects(enemy.destX, enemy.destY, enemy.spriteWidth, enemy.spriteHeight, projdestX, projdestY, projspriteWidth, projspriteHeight);
}
if(intersect == true) { alert("colliding"); }
else{drawImage(this);}
// if (intersect != true){
// drawImage(this);
// }
// else {
// alert("boom");
// }

if(this.destY <= 0){
offScreenFire = fires.indexOf(this);
fires.splice(offScreenFire, 1);
}
else
this.destY -= this.speed;

}

Player.prototype.takeTurn = function() {
drawImage(this);
}

Enemy.prototype.takeTurn = function() {

drawImage(this);


if (this.destY < canvas.height)
this.destY += this.speed;
else
this.destY = -32;
}

Island.prototype.takeTurn = function() {
drawImage(this);
this.destY += this.speed;
}

function fireAction() {

var fire = new Fire();

drawImage(fire);
fires.push(fire);

}

function drawImage(sprite) {
context.drawImage(sprites, sprite.spriteX, sprite.spriteY, sprite.spriteWidth, sprite.spriteHeight, sprite.destX, sprite.destY, sprite.spriteWidth, sprite.spriteHeight );
}

function gameLoop () {

context.clearRect(0, 0, canvas.width, canvas.height);

island.takeTurn();
player.takeTurn();

//console.log(fires); //debug

for (fire in fires) {
fires[fire].takeTurn();

}
for (enemy in enemies) {
enemies[enemy].takeTurn();

}

}


function intersects(x1, y1, w1, h1, x2, y2, w2, h2) {
if (w2 !== Infinity && w1 !== Infinity) {
w2 += x2;
w1 += x1;
if (isNaN(w1) || isNaN(w2) || x2 > w1 || x1 > w2)
return false;
}

if (y2 !== Infinity && h1 !== Infinity) {
h2 += y2;
h1 += y1;
if (isNaN(h1) || isNaN(y2) || y2 > h1 || y1 > h2)
return false;
}

return true;
}

window.onload = function() {
//alert('here');
canvas = document.getElementById('gameWorld');
context = canvas.getContext("2d");
sprites = new Image();

player = new Player('Brad');
island = new Island();


sprites.onload = function() {
drawImage(player);
for (i = 0; i < 3; i++) {
var enemy = new Enemy();
drawImage(enemy);
enemies.push(enemy);
}
}

sprites.src = "Sprites/1945.png";

gameLoopInterval = setInterval('gameLoop()', 100)
}




window.onkeypress = function(e){
var evt = window.event ? event : e;
//alert(evt.keyCode);
switch(evt.keyCode) {
case NORTH:

if (player.destY > 0)
player.destY -= player.speed;
else
player.destY == player.destY;

break;

case SOUTH:

if (player.destY < canvas.height - player.spriteWidth)
player.destY += player.speed;
else
player.destY == player.destY;

break;

case EAST:

if (player.destX < canvas.width - player.spriteWidth)
player.destX += player.speed;
else
player.destX == player.destY;

break;

case WEST:

if (player.destX > 0)
player.destX -= player.speed;
else
player.destX == player.destX;

break;

case FIRE:

fireAction();

break;
}
}
</script>

最佳答案

您的问题似乎在于:

for (enemy in enemies) {
intersect = intersects(enemy.destX, enemy.destY, enemy.spriteWidth, enemy.spriteHeight, projdestX, projdestY, projspriteWidth, projspriteHeight);
}

intersect 将始终保存最后的值。 (这意味着您实际上只是检查它是否与最后一个敌人相交。)

一个快速的解决方案是将内线更改为:

intersect = intersect || intersects(enemy.destX, enemy.destY, enemy.spriteWidth, enemy.spriteHeight, projdestX, projdestY, projspriteWidth, projspriteHeight);

如果火焰不与下一个敌人相交,这将使相交保持为true

编辑:

你的第二个问题与 for() 相同。在 javascript 中,当您执行 for in 时,第一个变量没有对实例的引用,而只是键。

您的最终 for 应如下所示:

for (enemy in enemies) {
intersect = intersect || intersects(enemies[enemy].destX, enemies[enemy].destY, enemies[enemy].spriteWidth, enemies[enemy].spriteHeight, projdestX, projdestY, projspriteWidth, projspriteHeight);
}

你似乎也没有产生任何敌人。在我的代码( http://jsfiddle.net/path411/umjnQ/ )中,我将以下代码片段添加到您的 gameLoop() 中:

if(enemies.length < 1) {
enemies.push(new Enemy());
}

如果你还没有敌人的话,这只会创建一个新敌人。 (您稍后可能想要更改)。

关于javascript - 检测数组中两个 Sprite 的碰撞? JavaScript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16448138/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com