用代码写一个threejs简单案例
时间: 2024-05-04 17:15:14 浏览: 95
好的,这个问题很适合我回答。以下是一个简单的 Three.js 实例代码:
首先,在 HTML 文件的 head 部分中引入 Three.js 库:
```html
<script src="https://cdn.jsdelivr.net/npm/three@0.125.1/build/three.min.js"></script>
```
然后,创建一个场景、相机和渲染器:
```javascript
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 );
```
接下来,创建一个立方体:
```javascript
var geometry = new THREE.BoxGeometry();
var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
var cube = new THREE.Mesh( geometry, material );
scene.add( cube );
```
最后,让相机指向立方体并渲染场景:
```javascript
camera.position.z = 5;
function animate() {
requestAnimationFrame( animate );
cube.rotation.x += 0.01;
cube.rotation.y += 0.01;
renderer.render( scene, camera );
}
animate();
```
以上代码可以让你在 Three.js 创建一个旋转的绿色立方体,希望你会喜欢!
阅读全文