請幫我理解html5遊戲的代碼

-1

我很難理解本教程。 https://www.youtube.com/watch?v=F2Dc-JlwgN4。請幫我理解html5遊戲的代碼

<canvas id="ctx" width="500" height="500" style="border:1px solid #000000"></canvas> 
<script> 
var ctx = document.getElementById("ctx").getContext("2d"); 
ctx.font = '30px Arial'; 
var height = 500; 
var width = 500; 
var message = "bouncing"; 
var player = { 
    x:50, 
    speedX:30, 
    y: 40, 
    speedY: 5, 
    name: "P", 
}; 
function getDistanceBetweenEntity(entity1, entity2){ 
    var vx = entity1.x - entity2.x; 
    var vy = entity1.y - entity2.y; 
    return Math.sqrt (vx*vx+vy*vy); 
} 

function testCollisionEntity(entity1, entity2){ 
    var distance = getDistanceBetweenEntity(entity1, entity2); 
    return distance < 30; 
} 

var enemyList = {}; 
enemey("E1", 150, 350, 10, 15, "E1"); 
enemey("E2", 250, 350, 10, -15, "E2"); 

function enemey(id,x,y,speedX,speedY, name) { 
var enemy2 = { 
    x: x, 
    speedX:speedX, 
    y: y, 
    speedY: speedY, 
    name: name, 
    id:id, 
}; 
    enemyList[id] = enemy2; 
} 
setInterval(update,40); 
function updateEntity(something){ 
    something.x += something.speedX; 
    something.y += something.speedY; 
    ctx.fillText(something.name, something.x, something.y); 

    if (something.x < 0 || something.x > width) { 
     console.log(message); 
     something.speedX =- something.speedX; 
    } 
    if (something.y < 0 || something.y > height) { 
     console.log(message); 
     something.speedY =- something.speedY; 
    } 

}; 
function update() { 
ctx.clearRect(0,0,height,width); 
for (var i in enemyList) { 
    updateEntity(enemyList[i]); 
    var isColliding = testCollisionEntity(player, enemyList[i]); 
    if (isColliding){ 
     console.log('colliding!') 
    } 
} 
    updateEntity(player); 
} 
</script>

這裏是的jsfiddle鏈接 http://jsfiddle.net/sinner019/0k9cnLce/

我不明白如何將這個拖參數使用實體和ENTITY2作品。你能幫我理解嗎？

來源

2015-04-20 Shuvo

這簡直是畢達哥拉斯，得到距離的2點之間的X和Y的變化，並返回斜邊，你到底還不明白嗎？ – juvian

它正在計算直角三角形的[斜邊]（http://en.wikipedia.org/wiki/Hypotenuse）的長度，該直角三角形相當於計算2d笛卡爾座標系上兩點之間的距離。 – Shashank

我不能理解哪個值傳遞給entity1和entity2。請看完整的代碼http://jsfiddle.net/sinner019/0k9cnLce/ – Shuvo

這是勾股定理：http://en.wikipedia.org/wiki/Pythagorean_theorem

它使用了基於X和Y值之差獲得的距離。

VX是在x值之差（或X行進距離）

VY是在y值

所以它返回VX的平方根的平方從而+ VY平方解決的差功能：

距離^ 2 = X^2 + Y^2

來源

2015-04-20 17:41:07 WakeskaterX

我需要了解如何entity1和entity2參數的作品。請你給我解釋一下。 – Shuvo

@Shuvo entity1和entity2可能是命名錯誤的變量 - 它們看起來像是引用這些實體的位置的對象，但它們也可能是整個實體本身 - 在您調用此函數的代碼中的某處並將這兩個實體和函數返回基於這兩個實體位置的斜邊的距離 - 你可以通過console.log來查看它們 - 除了我們無法幫助，也不應該幫助你做更多的事情 - 在嘗試構建遊戲之前，您應該先閱讀Javascript的基礎知識 –

請幫我理解html5遊戲的代碼

回答

相關問題