A tree rendered in three-dimensional JavaScript's game

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

No:10624

122

←

Prev Next

→

A tree rendered in three-dimensional JavaScript
Developer User4587｜Date and time 23/8/1 10:12:26
Build time 14.083 sec｜Game capacity 1.985KB｜

Script

Sure! Here's an example of a simple game that renders a tree in three-dimensional JavaScript, using pictograms and optimized for smartphone operation. The game allows the player to control the growth of the tree by tapping the screen.

To play the game, simply embed the code above into a single HTML file, and open it in a web browser on your smartphone. The game will render a green tree, and each tap on the screen will make the tree grow taller.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>3D Tree Game</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/110/three.min.js"></script>
</head>
<body>
    <script>
        // Set up the scene
        var scene = new THREE.Scene();
        var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
        var renderer = new THREE.WebGLRenderer();
        renderer.setSize(window.innerWidth, window.innerHeight);
        document.body.appendChild(renderer.domElement);
        
        // Generate the tree geometry
        var treeGeometry = new THREE.CylinderGeometry(0.01, 0.1, 1, 8, 1);
        
        // Generate the tree material
        var treeMaterial = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
        
        // Create the tree object
        var tree = new THREE.Mesh(treeGeometry, treeMaterial);
        scene.add(tree);
        
        // Set the initial tree position
        tree.position.y = -0.5;
        
        // Handle screen tap event
        document.addEventListener('click', function () {
            if (tree.scale.y < 10) {
                tree.scale.y += 0.2; // Increase the tree height on tap
                tree.position.y += 0.1; // Move the tree upwards on tap
            }
        });
        
        // Render the scene
        var animate = function () {
            requestAnimationFrame(animate);
            renderer.render(scene, camera);
        };
        
        animate();
    </script>
</body>
</html>
```

To play the game, simply embed the code above into a single HTML file, and open it in a web browser on your smartphone. The game will render a green tree, and each tap on the screen will make the tree grow taller.