Click here for free DL of the app version that can save data.

No:46175

167

←

Prev Next

→

Create Or Draw A Avatar
Developer User13970｜Date and time 24/2/23 21:47:16
Build time 5.069 sec｜Game capacity 1.079KB｜

Script

Avatar Game

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

Click here for free DL of the app version that can save data.

```
<!DOCTYPE html>
<html>
<head>
  <title>Avatar Game</title>
</head>
<body>
  <h1>Avatar Game</h1>
  <canvas id="avatarCanvas" width="400" height="400"></canvas>

const avatar = {
      x: 200,
      y: 200,
      size: 50,
      color: 'blue'
    };

function drawAvatar() {
      ctx.fillStyle = avatar.color;
      ctx.fillRect(avatar.x, avatar.y, avatar.size, avatar.size);
    }

function update() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      drawAvatar();
    }

function moveAvatar(event) {
      switch(event.key) {
        case 'ArrowUp':
          avatar.y -= 10;
          break;
        case 'ArrowDown':
          avatar.y += 10;
          break;
        case 'ArrowLeft':
          avatar.x -= 10;
          break;
        case 'ArrowRight':
          avatar.x += 10;
          break;
      }
      update();
    }

document.addEventListener('keydown', moveAvatar);
    update();
  </script>
</body>
</html>
```