Picture game where you see a picture and answer with a picture's game

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

No:7616

510

←

Prev Next

→

Picture game where you see a picture and answer wi..ALL
Developer o2pi4｜Date and time 23/7/8 23:57:10
Build time 11.034 sec｜Game capacity 2.264KB｜

Script

了解しました。絵で見えて絵で答える絵のゲームを作成します。以下にサンプルの実装を示します。

このプログラムは、クリックした位置に表示される絵文字が正解かどうかを判定するゲームです。絵文字のリストを用意し、ランダムに正解の絵文字を選びます。画面には絵文字のリストが表示され、プレイヤーは正解の絵文字をクリックすることで解答します。正解か不正解かはアラートで表示されます。以上がサンプルの実装となります。もちろん、このゲームをバリエーション豊かに拡張することも可能です。ご自身のアイデアを加えて、より面白い絵のゲームを作成してみてください。

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

了解しました。絵で見えて絵で答える絵のゲームを作成します。以下にサンプルの実装を示します。

```html
<!DOCTYPE html>
<html>
  <head>
    <title>絵で見えて絵で答えるゲーム</title>
  </head>
  <body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

const emojiList = ["🐱", "🐶", "🐔", "🐷", "🐸"];
        const correctEmojiIndex = Math.floor(Math.random() * emojiList.length);

canvas.addEventListener("click", function(event) {
          const rect = canvas.getBoundingClientRect();
          const mouseX = event.clientX - rect.left;
          const mouseY = event.clientY - rect.top;

if (mouseX >= 0 && mouseX <= canvas.width && mouseY >= 0 && mouseY <= canvas.height) {
            const selectedEmojiIndex = Math.floor(mouseX / (canvas.width / emojiList.length));

if (selectedEmojiIndex === correctEmojiIndex) {
              alert("正解！");
            } else {
              alert("不正解！");
            }
          }
        });

function draw() {
          ctx.clearRect(0, 0, canvas.width, canvas.height);

for (let i = 0; i < emojiList.length; i++) {
            ctx.fillText(emojiList[i], i * (canvas.width / emojiList.length) + 20, canvas.height / 2);
          }

requestAnimationFrame(draw);
        }

draw();
      };
    </script>
  </body>
</html>
```

このプログラムは、クリックした位置に表示される絵文字が正解かどうかを判定するゲームです。絵文字のリストを用意し、ランダムに正解の絵文字を選びます。画面には絵文字のリストが表示され、プレイヤーは正解の絵文字をクリックすることで解答します。正解か不正解かはアラートで表示されます。

以上がサンプルの実装となります。もちろん、このゲームをバリエーション豊かに拡張することも可能です。ご自身のアイデアを加えて、より面白い絵のゲームを作成してみてください。