1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
| import * as THREE from 'three'
import { OrbitControls } from 'three/addons/controls/OrbitControls.js'
const scene = new THREE.Scene()
const camera = new THREE.PerspectiveCamera(
50,
window.innerWidth / window.innerHeight,
0.1,
100
)
camera.position.set(0, 0, 3)
const renderer = new THREE.WebGLRenderer()
renderer.setSize(window.innerWidth, window.innerHeight)
const sketch = document.getElementById('app')
sketch.appendChild(renderer.domElement)
const geo = new THREE.BoxGeometry()
const mat = new THREE.MeshStandardMaterial({
metalness: 0.1,
roughness: 0.1,
})
const cube = new THREE.Mesh(geo, mat)
scene.add(cube)
const ambient = new THREE.AmbientLight('#fff', 0.1)
scene.add(ambient)
const dirLight = new THREE.DirectionalLight()
dirLight.position.set(1, 1, 5)
scene.add(dirLight)
new OrbitControls(camera, sketch)
renderer.setAnimationLoop(() => {
renderer.render(scene, camera)
})
|