Octahedron Three.js draws 3D graphics. The graphic is an octahedron. When the screen is tapped, a new octahedron is regenerated. The colors are random.'s game

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

No:8425

5048

←

Prev Next

→

Octahedron Three.js draws 3D graphics. The graphic..ALL
Developer anonymous｜Date and time 70/1/1 9:41:11
Build time unknown sec｜Game capacity 2.471KB｜

Script

上記のコードは、Three.jsを使用して八面体の3Dグラフィックを描画するゲームの一部です。HTMLファイルとして実装されており、JavaScriptの処理はscriptタグで囲まれています。ゲームとして遊ぶことができ、スマートフォンで操作することが想定されています。実行すると、画面に八面体が表示されます。画面をタップすると、新しい八面体がランダムな色で再生成されます。現在の八面体は回転し続けます。ご希望の処理が含まれているか確認ください。

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

```
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>八面体ゲーム</title>
  <style>
    body { margin: 0; }
    canvas { display: block; }
  </style>
</head>
<body>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r121/three.min.js"></script>
  <script>
    // レンダラーを作成
    const renderer = new THREE.WebGLRenderer();
    renderer.setSize(window.innerWidth, window.innerHeight);
    document.body.appendChild(renderer.domElement);

// シーンを作成
    const scene = new THREE.Scene();

// カメラを作成
    const camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 10000);
    camera.position.z = 1000;

// 八面体のジオメトリを作成
    const geometry = new THREE.OctahedronGeometry(200);

// ランダムな色を生成する関数
    function getRandomColor() {
      const letters = '0123456789ABCDEF';
      let color = '#';
      for (let i = 0; i < 6; i++) {
        color += letters[Math.floor(Math.random() * 16)];
      }
      return color;
    }

// 八面体を生成する関数
    function createOctahedron() {
      const material = new THREE.MeshBasicMaterial({ color: getRandomColor() });
      const octahedron = new THREE.Mesh(geometry, material);
      scene.add(octahedron);
    }

createOctahedron();

// クリックイベントリスナーを追加
    document.addEventListener('click', function() {
      createOctahedron();
    });

function animate() {
      requestAnimationFrame(animate);

// 八面体を回転させる
      scene.children.forEach(function(object) {
        object.rotation.x += 0.01;
        object.rotation.y += 0.02;
      });

// シーンをレンダリング
      renderer.render(scene, camera);
    }

animate();
  </script>
</body>
</html>
```

上記のコードは、Three.jsを使用して八面体の3Dグラフィックを描画するゲームの一部です。HTMLファイルとして実装されており、JavaScriptの処理はscriptタグで囲まれています。ゲームとして遊ぶことができ、スマートフォンで操作することが想定されています。

実行すると、画面に八面体が表示されます。画面をタップすると、新しい八面体がランダムな色で再生成されます。現在の八面体は回転し続けます。

ご希望の処理が含まれているか確認ください。