[ Web Proxy ]
URL:
Viewing: https://developer.mozilla.org/ja/docs/Web/API/WebGL_API/Tutorial/Animating_objects_with_WebGL [Back]  [Original]

WebGL - Web API | MDN

MDN Web Docs

View in English Always switch to English

WebGL

: "webgl-demo.js"

js
let squareRotation = 0.0;
let deltaTime = 0;

drawScene()

: "draw-scene.js" drawScene()

js
function drawScene(gl, programInfo, buffers, squareRotation) {

: drawScene() mat4.translate()

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

modelViewMatrix squareRotation Z

squareRotation

: main() drawScene()

js
let then = 0;

// 
function render(now) {
  now *= 0.001; // 
  deltaTime = now - then;
  then = now;

  drawScene(gl, programInfo, buffers, squareRotation);
  squareRotation += deltaTime;

  requestAnimationFrame(render);
}
requestAnimationFrame(render);

requestAnimationFrame "render" requestAnimationFrame deltaTime

squareRotation

|


Web Proxy Viewer  |  New URL  |  Original Page