課題提出
カシワザキ| You are currently viewing a revision titled "課題提出", saved on 2025年1月15日 11:11 PM by カシワザキ | |
|---|---|
| タイトル | 課題提出 |
| コンテンツ | <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simple A-Frame Game</title>
<script src="https://aframe.io/releases/1.4.2/aframe.min.js"></script>
</head>
<body>
<a-scene>
<!-- カメラとカーソル -->
<a-entity camera position="0 1.6 0">
<a-entity
cursor="fuse: false; rayOrigin: mouse"
position="0 0 -1"
metry="primitive: ring; radiusInner: 0.02; radiusOuter: 0.03"
material="color: black; shader: flat"></a-entity>
</a-entity>
<!-- スコア表示 -->
<a-text id="scoreText" value="Score: 0" position="-1 2 -3" color="white"
width="4"></a-text>
<!-- ターゲット -->
<a-entity id="target" geometry="primitive: box; height: 0.5; width: 0.5; depth: 0.5"
material="color: red" position="0 1.5 -3"
class="clickable"></a-entity>
<!-- 環境 -->
<a-sky color="#6EBAA7"></a-sky>
<a-plane rotation="-90 0 0" width="10" height="10" color="#7BC8A4"></a-plane>
</a-scene>
<script>
let score = 0;
const scoreText = document.querySelector('#scoreText');
const target = document.querySelector('#target');
// ターゲットをクリックするとスコアアップ
target.addEventListener('click', () => {
score++;
scoreText.setAttribute('value', `Score: ${score}`);
// ターゲットの位置をランダムに移動
const randomX = (Math.random() * 6) - 3; // -3 to 3
const randomY = (Math.random() * 3) + 1; // 1 to 4
const randomZ = (Math.random() * -5) - 2; // -2 to -7
target.setAttribute('position', `${randomX} ${randomY} ${randomZ}`);
});
</script>
</body>
</html> |
| 抜粋 | |
| 脚注 |
