분류 전체보기

라이브러리를 이용한 애니메이션

라이브러리를 이용한 애니메이션애니메이션 라이브러리 사이트 : Green Sock Green Sock NPM 설치 [깃허브 바로가기]> npm install gsap  import gsap from "gsap";const scene = new THREE.Scene(); const camera = new THREE.PerspectiveCamera(75, // 시야각 (field of view)window.innerWidth / window.innerHeight, // 종횡비(aspect)0.1, // near1000 // far); scene.add(camera); const geometry = new THREE.BoxGeometry(1, 1, 1);const material = new THREE.MeshS..

애니메이션 성능 보정

애니메이션 성능 보정 사용자마다 다른 기기에서 사용컴퓨터 성능에 따라 움직이는 속도가 다를 수 있음 주의 getElapsedTime()와 getDelta()은 동시에 사용하면 값이 꼬이기 때문에 동시에 사용하지 말자  성능 보정 : 경과시간 clock.getElapsedTime() clock.getElapsedTime() 메서드를 사용하여 경과시간으로 성능 보정하기 실행 시점으로부터 총 경과 시간초 단위로 찍힘성능이 시간에 영향을 주지 않음 (절대 시간)  기존// 1초에 60도씩 돌아간다.mesh.rotation.y += THREE.MathUtils.degToRad(1);  성능 보정// 1도 대신 경과 시간을 넣기const time = clock.getElapsedTime() ;mesh.rotatio..

애니메이션 기본

애니메이션 넣기 mesh 회전시키기 import * as THREE from "three"; /* 그리기 */ function draw() { // 애니메이션 추가 // mesh.rotation.y += 0.1; // 각도는 Radian을 사용, 360도는 2파이 mesh.rotation.y += THREE.MathUtils.degToRad(1); mesh.position.y += 0.01; if (mesh.position.y > 3) { mesh.position.y = 0; } renderer.render(scene, camera); // window.requestAnimationFrame(draw); renderer.setAnimati..

Find OPtions(LessThan, MoreThan … ) , 데이터를 조회할 때 사용되는 옵션

typeORM의 operator 활용https://orkhan.gitbook.io/typeorm/docs/find-optionsTypeORM에서 데이터베이스에서 데이터를 조회할 때 사용되는 옵션들을 정의할 수 있는 객체  LessThan, 지정한 값보다 작은 값을 찾기const users = await userRepository.find({ where: { age: LessThan(30) }});// age가 30보다 작은 사용자들을 조회합니다.  LessThanOrEqual, 지정한 값보다 작거나 같은 값을 찾기const users = await userRepository.find({ where: { age: LessThanOrEqual(30) }});//..