*
//화면 생성
let scene = new THREE.Scene();
scene.fog = new THREE.Fog(0xFFBD00, 8, 30);
//카메라 설정
let camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 0.1, 1000);
camera.position.z = 10;
//렌더링 설정
let renderer = new THREE.WebGLRenderer({antialias: true, alpha: true});
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setPixelRatio(window.devicePixelRatio > 1 ? 2 : 1);
document.body.appendChild(renderer.domElement);
//모양 설정
let materials = [
new THREE.MeshBasicMaterial({color:0xFF61AD, wireframe:true}),
new THREE.MeshBasicMaterial({color:0xFF5BDB, wireframe:true}),
new THREE.MeshBasicMaterial({color:0xFFAC63, wireframe:true}),
new THREE.MeshBasicMaterial({color:0xFF8282, wireframe:true})
];
let geometry = new THREE.IcosahedronGeometry(1, 1);
for (let i = 0; i < 20; i ++) {
const mesh = new THREE.Mesh(geometry, materials[Math.floor(Math.random() * 4)]);
const scale = Math.random() + 0.5;
mesh.scale.multiplyScalar(scale);
mesh.position.random().subScalar(0.5).multiplyScalar(15);
mesh.speed = new THREE.Vector3().random().subScalar(0.5).multiplyScalar(0.01);
scene.add(mesh);
}
//애니메이션 설정
function animate() {
requestAnimationFrame(animate);
scene.children.forEach(mesh => {
mesh.rotation.x += mesh.speed.x;
mesh.rotation.y += mesh.speed.y;
mesh.rotation.z += mesh.speed.z;
scene.rotation.x += 0.0001;
scene.rotation.y += 0.0001;
scene.rotation.z += 0.0001;
});
renderer.render(scene, camera);
}
animate();
//화면 사이즈 설정
function onWindowResize() {
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize(window.innerWidth, window.innerHeight);
}
window.addEventListener('resize', onWindowResize);
What’s on our mind?
Collection of articles, design, site, and resources made by designers and publisher
@Menu View
ad