Create a 3D HTML Game - Simple Tutorial - 常规

<!DOCTYPE html>
<html>
<head>
	<title>3D HTML Game - Simple Tutorial</title>
	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: #000000;
		}
		canvas {
			width: 100%;
			height: 100%;
		}
	</style>
</head>
<body>
	<script>
		// Set up the scene
		let scene = new THREE.Scene();
<pre><code>	// Set up the camera
	let camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);
	camera.position.z = 5;

	// Set up the renderer
	let renderer = new THREE.WebGLRenderer();
	renderer.setSize(window.innerWidth, window.innerHeight);
	document.body.appendChild(renderer.domElement);

	// Set up the geometry
	let geometry = new THREE.BoxGeometry(1,1,1);
	let material = new THREE.MeshBasicMaterial({color: 0x00ff00});
	let cube = new THREE.Mesh(geometry, material);
	scene.add(cube);

	// Set up the controls
	let controls = new THREE.OrbitControls(camera, renderer.domElement);

	// Render the scene
	function animate() {
		requestAnimationFrame(animate);
		cube.rotation.x += 0.01;
		cube.rotation.y += 0.01;
		renderer.render(scene, camera);
		controls.update();
	}
	animate();
&lt;/script&gt;
</code></pre>
</body>
</html>