title: Calculate the position to give an acceleration / deceleration effect to a square in animated gif?
body: <p>I would like to calculate the position of $x to give an acceleration / deceleration effect to a square in this animated gif.</p>
  <p>Currently, the only thing I can do is a constant displacement of this square.</p>
  <p>How to find the value of $x to give this acceleration / deceleration effect for each animated GIF frame?</p>
  <pre><code>$fps = 25;
  
  $initialVelocity = 5;
  $finalVelocity = 0;
  $duration = 2000;
  $distance = 300;
  
  $nbFrames = $duration / 1000 * $fps;
  
  $imFrames = new Imagick();
  for ($i = 0; $i &lt; $nbFrames; $i++)
  {
      $currentTime = $duration / ($nbFrames - 1) * $i;
          
      $x = $distance / $duration * $currentTime; // How i can apply velocity on the $x coordinate ?
      
      $draw = new ImagickDraw();
      $draw-&gt;setFillColor('#ff0000');
      $draw-&gt;rectangle(
          $x,
          10,
          $x + 10,
          20
      );
      
      $imFrame = new Imagick();
      $imFrame-&gt;newImage(400, 40, '#5b5b5b');
      $imFrame-&gt;drawImage($draw);
      $imFrame-&gt;setImageDelay(100 / $fps);
      $imFrame-&gt;setImageFormat('gif');
      $imFrame-&gt;setImageDispose(3); // clean previous frame
      
      $imFrames-&gt;addImage($imFrame);
  }
  
  header('Content-type: image/gif');
  $imFrames-&gt;setFormat('gif');
  echo $imFrames-&gt;getImagesBlob();
  exit();
  </code></pre>
  <h2>EDIT :</h2>
  <p>I do not happen.</p>
  <p>I would like it to move from 0 to x but my square makes back trips.</p>
  <p><a href="https://i.stack.imgur.com/t4Dz8.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/t4Dz8.gif" alt="animated.gif" /></a></p>
  <pre><code>$fps = 25;
  
  $initialVelocity = 6;
  $finalVelocity = 0;
  $duration = 2000;
  $distance = 100;
  $acceleration = ($finalVelocity - $initialVelocity) / $duration;
  $nbFrames = $duration / 1000 * $fps;
  
  $imFrames = new imagick();
  for ($i = 0; $i &lt; $nbFrames; $i++)
  {
      $timePerFrame = $duration / ($nbFrames - 1);
      $currentTime = $timePerFrame * $i;
          
      $velocity = $initialVelocity + ($acceleration * $currentTime);
      $x = $distance / $duration * $currentTime;
      $x *= $velocity;
          
      $draw = new ImagickDraw();
      $draw-&gt;setFillColor('#ff0000');
      $draw-&gt;rectangle(
          $x,
          10,
          $x + 10,
          20
      );
      
      $imFrame = new Imagick();
      $imFrame-&gt;newImage(400, 40, '#5b5b5b');
      $imFrame-&gt;drawImage($draw);
      $imFrame-&gt;setImageDelay(100 / $fps);
      $imFrame-&gt;setImageFormat('gif');
      $imFrame-&gt;setImageDispose(3); // clean previous
      
      $imFrames-&gt;addImage($imFrame);
  }
  
  header('Content-type: image/gif');
  $imFrames-&gt;setFormat('gif');
  echo $imFrames-&gt;getImagesBlob();
  exit();
  </code></pre>