学习完怎么创建一个正方形，以及给正方形顶点色后，之前绘制的方形只是一个静态的图形，为了做出更炫的场景，就得让正方动起来。通过这个例子来学习如何让2D的正方形进行三维旋转和移动。其实现原理主要是在指定的时间内改变X轴、Y轴、Z轴上的值，然后再重新调用绘制的方法来重绘，使得正方形动起来。

旋转

要想让正方形进行旋转，首先需要设定一个变量squareRotation，来跟踪正方形旋转的情况，由于要将旋转做成可持续的，所以还需要随便改变squareRotation的值，在这里使用requestAnimationFrame来定时更新squareRotation的值，如下所示：

  var then = 0;
  function render(now) {
    now *= 0.001;  // convert to seconds
    const deltaTime = now - then;
    then = now;
    drawScene(gl, programInfo, buffers, deltaTime);
    requestAnimationFrame(render);
  }
  requestAnimationFrame(render);

改变旋转的变量后，通过下面的方法对正方形进行旋转：

mat4.rotate(modelViewMatrix,
      modelViewMatrix,
      this.squareRotation,
      [0, 0, 1]);

个人博客