基于map函数生成星战片头动画

函数map的参数_map函数_函数map是什么意思

—代码来自Daniel Shiffman

前面讲过生成动画的基本原理，核心在于定义物体的移动控制。

这个案例中，主要牵涉到的知识点有：

translate(x,y)

将坐标原点移动到指定的(x,y)点。

这个函数是一种方便用法，如果不用这个函数也能实现所有的移动位置计算，但是会稍微复杂一些。在计算一些数学问题时，我们知道适当的考虑将坐标系移动，将会简化问题。比如，以原点为圆心位置的圆，和任意位置的圆的计算问题，显然是以坐标原点为圆心的圆会更好计算。

map函数

一般map函数有5个参数。这个函数的意思很明显是要做一个值的范围映射。

第一个参数是要映射的值。

第二个和第三个参数是该值的上下限。

第四个第五个参数是该值映射后的上下限。

一般场景是，我们需要计算出一个比例，然后映射到屏幕上的像素位置。

Star类

// Star.pde
class Star
{
  float x,y,z;
  float pz;
  Star()
  {
    x = random(-width,width);
    y = random(-height,height);
    z = random(0,width);
    pz = z; 
  }
  void update()
  {
    z = z - speed;
    if(z < 1)
    {
      z = width;
      x = random(-width,width);
      y = random(-height,height);
      pz = z;
    }
  }
  void show()
  {
    fill(255);
    noStroke();
    float sx = map(x / z, 0, 1, 0, width);
    float sy = map(y / z, 0, 1, 0, height);
    //float r = map(z,0, width,16,0);
    //ellipse(sx,sy,r,r);
    float px = map(x / pz, 0, 1, 0, width);
    float py = map(y / pz, 0, 1, 0, height);
    stroke(255);
    line(px,py,sx,sy);
    pz = z;
  }
}

入口调用

// StarField.pde
// 实例化对象
Star[] stars = new Star[10000];
float speed; // 鼠标移动速度
void setup()
{
  size(800,600);
  for(int i = 0; i < stars.length; i++)
  { 
    stars[i] = new Star();
  }
}
void draw()
{
  speed = map(mouseX,0,width,0,50);
  background(0);
  translate(width / 2, height / 2);
  for(int i = 0; i < stars.length; i++)
  {
    stars[i].update();
    stars[i].show();
  }
}

函数map的参数_map函数_函数map是什么意思