topical media & game development

talk show tell print

print / present

math(s) -- animation

math(s) / tutorial(s)

math -- animation 3

math(s) / tutorial(s)

basic trigonometric functions



  sine of angle = opposite / hypotenuse
  cosine of angle = adjacent / hypotenuse
  tangent of angle = opposite / adjacent
  

convert radians to degrees



  radians = degrees * Math.PI / 180
  degrees = radians * 180 / Math.PI
  

rotate to mouse



  dx = mouseX - sprite.x
  dy = mouseY - sprite.y
  sprite.rotation = Math.atan2(dy,dx) * 180 / Math.PI
  

create wave(s)



  public function frame(event:Event) {
  value = center + Math.sin(angle) * range;
  angle += speed;
  }
  

create circle(s)



  public function frame(event:Event) {
  x = centerX + Math.cos(angle) * radius;
  y = centerY + Math.sin(angle) * radius;
  angle += speed;
  }
  

create oval(s)



  public function frame(event:Event) {
  x = centerX + Math.cos(angle) * radiusX;
  y = centerY + Math.sin(angle) * radiusY;
  angle += speed;
  }
  

distance between point(s)



  dx = x2 - x1;
  dy = y2 - y1;
  distance = Math.sqrt(dx*dx + dy*dy);
  

math -- animation 4

math(s) / tutorial(s)

combine color(s)



  color24 = red << 16 | green << 8 | blue;
  color32 = alpha << 24 | red << 16 | green << 8 | blue;
  

extract color(s)



  red = color24 >> 16;
  green = color24 >> 8 & 0xFF;
  blue = color24 & 0xFF;
  

  alpha = color32 >> 24;
  red = color32 >> 16;
  green = color32 >> 8 & 0xFF;
  blue = color32 & 0xFF;
  

draw curve(s)



     // draw through (xt,yt) with endpoints (x0,y0) and (x2,y2)
  x1 = xt * 2 - (x0 + x2)/2; 
  y1 = xt * 2 - (y0 + y2)/2; 
  moveTo(x0,y0);
  curveTo(x1,y1,x2,y2);
  

math -- animation 5

math(s) / tutorial(s)

convert angular velocity(s)



  vx = speed * Math.cos(angle);
  vy = speed * Math.sin(angle);
  

convert angular acceleration(s)



  ax = force * Math.cos(angle);
  ay = force * Math.sin(angle);
  

add velocity(s)



  sprite.x += vx;
  sprite.y += vy;
  

add acceleration(s)



  vx += ax;
  vy += ay;
  

math -- animation 06

math(s) / tutorial(s)

out-of-bound(s)



  if ( sprite.x - sprite.width/2 > right ||
       sprite.x + sprite.width/2 < left ||
       sprite.y - sprite.height/2 > bottom ||
       sprite.y + sprite.height/2 < top )   
       {
       ...
       }
  

out-of-bound wrap(s)



  if (sprite.x - sprite.width/2 > right) {
     sprite.x = left - sprite.width/2;
  } else if (sprite.x + sprite.width/2 < left} {
     sprite.x = right + sprite.width/2;
  } if (sprite.y - sprite.height/2 > bottom) {
     sprite.y = top - sprite.height/2;
  } else if (sprite.y + sprite.height/2 < top)
     sprite.y = bottom + sprite.height/2;
  }
  

correct friction(s)



  speed = Math.sqrt(vx*vx + vy*vy);
  angle = Math.atan2(vy,vx);
  if (speed > friction) { speed -= friction; }
  else { speed = 0; }
  

easy friction(s)



  vx *= friction;
  vy *= friction;
  

math -- animation 08

math(s) / tutorial(s)

easing(s)



  dx = targetX - sprite.x;
  dy = targetY - sprite.y;
  vx = dx * easing;
  vy = dy * easing;
  sprite.x += vx;
  sprite.y += vy;
  

spring(s)



  ax = (targetX - sprite.x) * spring;
  ay = (targetY - sprite.y) * spring;
  vx += ax;
  vy += ay;
  vx *= friction;
  vy *= friction;
  sprite.x += vx;
  sprite.y += vy;
  

offset(s)



  dx = sprite.x - fixedX;
  dy = sprite.y - fixedY;
  angle = Math.atan2(dy,dx);
  targetX = fixedX + Math.cos(angle) * springLength;
  targetY = fixedY + Math.sin(angle) * springLength;
  // spring to target
  

math -- animation 09

math(s) / tutorial(s)

collision(s)



  dx = spriteB.x - spriteA.x;
  dy = spriteB.y - spriteB.y;
  distance = Math.sqrt(dx*dx + dy*dy);
  if (distance < spriteA.radius + spriteB.radius) {
   ...
  }
  

multiple collision(s)



  var max:Number = ...;
  for (var i:uint; i < max; i++) {
    var objectA = objects[i];
    for (var j:uint = i - 1; j < max; j++) { 
        var objectB = objects[j];
        
do detection collision(s)
} }

math -- animation 10

math(s) / tutorial(s)

coordinate rotation(s)



  x1 = Math.cos(angle) * x - Math.sin(angle) * y;
  y1 = Math.cos(angle) * y + Math.sin(angle) * x;
  

reverse coordinate rotation(s)



  x1 = Math.cos(angle) * x + Math.sin(angle) * y;
  y1 = Math.cos(angle) * y - Math.sin(angle) * x;
  

math -- animation 11

math(s) / tutorial(s)

momentum conservation(s)



  vxTotal = vx0 - vx1;
  vx0 = ((ball0.mass - ball1.mass) * vx0 + 2 * ball1.mass * vx1) / 
        (ball0.mass + ball1.mass);
  vx1 = vxTotal + vx0;
  

math -- animation 12

math(s) / tutorial(s)

gravitation(s)



  dx = partB.x - partA.x;
  dy = partB.y - partA.y;
  distSQ = dx*dx + dy*dy;
  distance = Math.sqrt(distSQ);
  force = partA.mass * partB.mass / distSQ;
  ax = force * dx / distance;
  ay = force * dy / distance;
  partA.vx += ax / partA.mass;
  partA.vy += ay / partA.mass;
  partB.vx += ax / partB.mass;
  partB.vy += ay / partB.mass;
  

math -- animation 14

math(s) / tutorial(s)

law of cosine(s)



  angleA = Math.acos((b*b + c*c - a*a) / (2 * b * c));
  angleB = Math.acos((a*a + c*c - b*b) / (2 * a * c));
  angleC = Math.acos((a*a + b*b - c*c) / (2 * a * b));
  

math -- animation 15

math(s) / tutorial(s)

basic perspective(s)



  scale = fl / (fl + zpos);
  sprite.scaleX = sprite.scaleY = scale;
  sprite.alpha = scale;  // optional
  sprite.x = vanishingPointX + xpos * scale;
  sprite.y = vanishingPointY + ypos * scale;
  

Z sorting(s)



  // array of 3D object with zpos property;
  objectArray.sortOn("zpos", Array.DESCENDING | Array.NUMERIC);
  for (var i:unint; i < numObjects; i++) {
    setChildIndex(objectArray[i].i);
  }
  

coordinate rotation(s)



  x1 = Math.cos(angleZ) * xpos - Math.sin(angleZ) * ypos;
  y1 = Math.cos(angleZ) * ypos + Math.sin(angleZ) * xpos;
  
  x1 = Math.cos(angleY) * xpos - Math.sin(angleY) * zpos;
  z1 = Math.cos(angleY) * zpos + Math.sin(angleY) * xpos;
  
  y1 = Math.cos(angleX) * ypos - Math.sin(angleX) * zpos;
  z1 = Math.cos(angleX) * zpos + Math.sin(angleX) * ypos;
  

3D distance(s)



  distance = Math.sqrt(dx*dx + dy*dy + dz*dz);
  


(C) Æliens 04/09/2009

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.