Javascript 冲突问题

Javascript Collision Issues

本文关键字:问题 冲突 Javascript      更新时间:2023-09-26

我有一个球在屏幕上弹跳,我需要编写代码,当它与玩家碰撞时基本上结束游戏......这是我当前的代码,但它不起作用。如果您需要更多信息,请告诉我。

if(playerLoc == ballLoc){
       gameOver();
       }

其中 playerLoc/ballLoc 基于 X 和 Y 轴测量进行测量。

<script language="JavaScript">
    //get info, process data, update screen objects
        //instance vars
        var player;
        var ball;
        var score;
        var axis;
        var ballaxis;
        //initial speeds
        var dx = 6;
        var dy = 6;
        var currentScore = 0;
        var timer;
        //set initial conditions for ball and paddle
        var playerTop = 400;
        var playerLeft = 200;
        var ballLeft = 228;
        var ballTop = 4;
        var playerLoc = playerLeft + playerTop;
        var ballLoc = ballLeft + ballTop;
        function init(){
            //instantiate HTML object instance vars
            player = document.getElementById('player');
            ball = document.getElementById('ball');
            score = document.getElementById('score');
            axis = document.getElementById('axis');
            ballaxis = document.getElementById('ballaxis');
            //register key listener with document object
            document.onkeydown = keyListener;
            //start the game loop
            start();
        }
        function keyListener(e){
            if(!e){
                //for IE
                e = window.event;
            }
            if(e.keyCode==37 && playerLeft > 0){
                //keyCode 37 is left arrow
                playerLeft -= 10;
                player.style.left = playerLeft + 'px';
            }
            if(e.keyCode==39 && playerLeft < 450){
                //keyCode 39 is right arrow
                playerLeft += 10;
                player.style.left = playerLeft + 'px';
            }
            if(e.keyCode==38 && playerTop > 0){
                //keyCode 38 is up arrow
                playerTop -= 10;
                player.style.top = playerTop + 'px';
            }
            if(e.keyCode==40 && playerTop < 450){
                //keyCode 40 is down arrow
                playerTop += 10;
                player.style.top = playerTop + 'px';
            }
        }
        function start(){
            //game loop
            render();
            detectCollisions();
            difficulty();
            axisMeasure();
            //end conditions
            if(playerLoc == ballLoc){
                gameOver();
                }
            else{
                //still in play - keep the loop going
                timer = setTimeout('start()',50);   
            }
        }

        function detectCollisions(){
            //just reflect the ball on a collision
            //a more robust engine could change trajectory of ball based
            //on where the ball hits the paddle
            if(collisionX())
                dx = dx * -1;
            if(collisionY())
                dy = dy * -1;
        }
        function collisionX(){
            //check left and right boundaries
            if(ballLeft < 2 || ballLeft > 480)
                return true;
            else {
                return false;   
            }
        }
        function collisionY(){
            //check if at top of playing area
            if(ballTop < 2  || ballTop > 480)
                return true;
            else {
                return false;
            }    
        }
        function render(){
            moveBall();
            updateScore();
        }
        function moveBall(){
            ballLeft += dx;
            ballTop += dy;
            ball.style.left = ballLeft;
            ball.style.top = ballTop;
        }
        function axisMeasure(){
            axis.innerHTML = 'P X-Axis: ' + playerLeft + ' P Y-Axis:   ' + playerTop
            ballaxis.innerHTML = 'B X-Axis: ' + ballLeft + ' B Y-Axis:   ' + ballTop        
        }
        function updateScore(){
            currentScore += 5;
            score.innerHTML = 'Score: ' + currentScore;
        }
        function difficulty(){
            //as the game progresses, increase magnitude of the vertical speed
            if(currentScore % 1000 == 0){
                if(dy > 0)
                    dy += 1;
                else
                    dy -= 1;
            }
        }
        function gameOver(){
            //end the game by clearing the timer, modifying the score label
            clearTimeout(timer);
            score.innerHTML += "   Game Over";
            score.style.backgroundColor = 'rgb(128,0,0)';

哈哈,好吧,你没有显示任何代码。所以这是一个完整的黑暗镜头。

if(playerLoc.x == ballLoc.x && playerLoc.y == ballLoc.y){
       gameOver();
}

或者,甚至尝试距离方法。

var distance = Math.sqrt((ballLoc.x- playerLoc.x) *(ballLoc.x-playerLoc.x) + (ballLoc.y - playerLoc.y) * (ballLoc.y-playerLoc.y));
if(distance < *some amount*)}
       gameOver();
}

这里还有一个远程检查的现场演示。

编辑

好的,现在代码已经发布,我的答案有些无关紧要,但无论如何,我都把它留在这里,因为距离检查是一种有效的方法,甚至可以在 OP 的情况下工作。

var ballX = ballLeft + (ballWidth/2),
    ballY = ballTop + (ballHeight/2),
    playerX = playerLeft + (playerWidth/2),
    playerY = playerTop + (playerHeight/2);
var distance = Math.sqrt((ballX - playerX) *(ballX - playerX) + (ballY - playerTop) * (ballY - playerTop )); 
if(distance < 25){ gameOver(); }
相关文章: