隨着質量的提高，速度下降

Question

試圖開發一個Agar克隆，我已經得到了很多，但我無法弄清楚隨着質量的增加如何減少玩家的速度。我嘗試了幾種不同的方式，但沒有任何效果。當質量上升時，我會如何讓速度降下來？這是我的jsFiddle。這是我設定球員的速度的地方：

var playerOneMass = 36; 
var player1X = (canvas.width/2) + 50; 
var player = new Player({ 
    x: player1X, 
    y: canvas.height/2, 
    radius: playerOneMass, 
    speed: { 
     x: 5, 
     y: 5 
    }, 
    name: "player 1", 
    dir: null 
}); 
var playerTwoMass = 36; 
var player2X = (canvas.width/2) - 50; 
var player2 = new Player({ 
    x: player2X, 
    y: canvas.height/2, 
    radius: playerTwoMass, 
    speed: { 
     x: 5, 
     y: 5 
    }, 
    name: "player 2", 
    dir: null 
}); 

Answer 1

讓我們帶一些數學來幫助我們一點點。當你希望某物變得越來越小而另一個變得越來越大時，我發現的最佳選擇是使用inversely proportional關係。這可以讓你的視覺更小更平滑。

new_speed = scalar * start_speed/current_mass 

當想出這個標量時，我發現最好的嘗試和錯誤，直到它看起來如何你想要它。

---

這裏是使用Two.js的實際方程的一個例子。

var two = new Two({width:320, height:180}).appendTo(document.getElementById("mytwo")), 
 
    rect = two.makeRectangle(100, 100, 10, 10), 
 
    circ = two.makeCircle(5, 100, 5), 
 
    mass = 10, 
 
    rspeed = Math.PI/10, 
 
    mspeed = 14, 
 
    scalar = 10; 
 
// Make it look pretty! 
 
rect.fill = "rgb(100,255,100)"; 
 
circ.fill = "rgb(100,100,255)"; 
 
// Looping... 
 
two.bind('update', function(fc) { 
 
    // Prevents from growing indefinetely 
 
    if(mass > 150) return; 
 
    mass += 1.5; 
 
    rect.scale += .1; 
 
    circ.scale += .1; 
 
    rect.rotation += scalar * rspeed/mass; 
 
    circ.translation.addSelf(new Two.Vector(
 
     scalar * mspeed/mass, 0)); 
 
}).play();

<script src="https://rawgit.com/jonobr1/two.js/master/build/two.min.js"></script> 
 

 
<div id="mytwo"><div></div></div>