title: Moving an object along a straight line at a constant speed from point A to B
body: <p><strong>I know this has been asked a few times before, but there has been no answer that actually works that I can find. There is a similar one, but the speed varies depending on the distance travelled.</strong></p>
  
  <p>So my problem is that I am trying to get an object (a player in this case) to move a long a straight line from point A to B at a constant speed. This is done by clicking on the player and dragging to where I want him to walk to, so it can be in any direction and over any distance.</p>
  
  <p>I have some code that very nearly works, but the player always ends up slightly off course, more so the longer the distance he travels is. Here is that code:</p>
  
  <pre><code>window.addEventListener('mouseup', function(e) {
      selectedPlayer.moveX = e.pageX;
      selectedPlayer.moveY = e.pageY;
      movePlayer(selectedPlayer);
  });
  
  function movePlayer(player) {
  
      var xDistance = player.moveX - player.x;
      var yDistance = player.moveY - player.y;
      var travelDistance = Math.sqrt((xDistance * xDistance) + (yDistance * yDistance));
      var timeToTravel = travelDistance; //This may seem pointless, but I will add a speed variable later
      var playerAngle = Math.atan2(yDistance, xDistance) * (180 / Math.PI);
      var xRatio = Math.atan2(xDistance, travelDistance);
      var yRatio = Math.atan2(yDistance, travelDistance);
  
      //This function is called in another part of code that repeats it 60 times a second
      walkPlayer = function() {
  
          setTimeout(function(){
              player.x = player.moveX;
              player.y = player.moveY;
              selectedPlayer = undefined;
              walkPlayer = undefined;
          }, timeToTravel * 20)
  
          player.angle = playerAngle;
          player.x += xRatio;
          player.y += yRatio;
      };
  }
  </code></pre>
  
  <p>I hope this makes sense, I've had to include only the part of the code that is relevant. I think my issue probably lies with the xRatio and yRatio parts, but I can't figure it out; I'm completely stumped.</p>
  
  <p>EDIT: I'd like to add that playerAngle makes the player face in the direction of the drag, and that part works fine.</p>