Moong

animation function draw() { // 애니메이션 동작 mesh.rotation.y += THREE.MathUtils.degToRad(1); renderer.render(scene, camera); // 재귀를 통한 애니메이션 window.requestAnimationFrame(draw); // 1) window func 이용 renderer.setAnimationLoop(draw); // 2) three.js func 이용 } 성능 보정 기기 성능에 따라 animation frame 수가 다른 문제 해결 getElapsedTime() 💡 절대 시간을 변경 값에 이용하여 성능 보정 const clock = new THREE.Clock(); function draw() { const tim..

three.js 설치 및 import npm i three import * as THREE from ‘three’; Renderer const renderer = new THREE.WebGLRenderer({ canvas: canvas, antialias: true, alpha: true }) 속성 ▪️ canvas : render할 canvas ▪️ antialias : 계단현상 없애기 ▪️ alpha : 배경 투명도 methods ▪️ setSize : 가로 세로 사이즈 정하기 renderer.setSize(window.innerWidth, window.innerHeight); ▪️ setPixelRatio : 해상도 정하기 renderer.setPixelRatio(window.devicePixelR..