wam
w__am 개발노트
wam
  • 분류 전체보기 (165)
    • CS 지식 (10)
      • 자료구조 (0)
      • 알고리즘 (0)
      • 컴퓨터 구조 (0)
      • 운영체제 (0)
      • 네트워크 (7)
      • 데이터베이스 (0)
      • 디자인 패턴 (3)
    • Frontend (131)
      • Three.js (64)
      • NPM (1)
      • Nest.js (19)
      • React (10)
      • Apollo (7)
      • TypeScript (2)
      • JavaScript (12)
      • HTML, CSS (1)
      • Jest (3)
      • E2E (5)
      • Cypress (7)
    • Database (12)
      • TypeORM (12)
    • IT 지식 (8)
      • 클라우드 서비스 (3)
      • 네트워크 (1)
      • 데이터 포맷 (2)
      • 기타 (2)
    • IT Book (2)
    • 유용한 사이트 (1)

블로그 메뉴

  • 홈
  • 태그
  • 방명록
  • 🐱 Github

인기 글

태그

  • 원형적인 움직임
  • getdelta()
  • react 성능 최적화
  • 함수 선언문
  • Decorators
  • threejs 개발 할 때 도움을 줄 수 있는 유틸리티
  • getelapsedtime()
  • reactive variables
  • Interface
  • three.js 구성 요소
  • 렌더링 성능 최적화
  • 스코프
  • 데이터 포맷
  • type-graphql
  • math.sin()
  • API
  • 오프-프레미스(off-premise) 방식
  • joi 에러
  • isabstract
  • 초기 환경설정
  • e.preventdefault()
  • 함수 리터럴
  • 디자인 패턴
  • 함수의 범위
  • 삼각함수
  • math.cos()
  • gridhelper
  • axeshelper
  • mapped types
  • 함수 표현식

최근 글

관리자

글쓰기 / 스킨편집 / 관리자페이지
hELLO · Designed By 정상우.
wam

w__am 개발노트

조명, Light 애니메이션
Frontend/Three.js

조명, Light 애니메이션

2024. 11. 3. 04:14
  /* 그리기 */
  const clock = new THREE.Clock();

  function draw() {
    // 삼각함수 사용하여 반지름이 5인 원을 그리며 이동하기
    const time = clock.getElapsedTime();

    light.position.x = Math.cos(time) * 5;
    light.position.z = Math.sin(time) * 5;

    renderer.render(scene, camera);
    renderer.setAnimationLoop(draw);
  }

 

 

https://wam6577.tistory.com/158

 

시간 흐름 측정, getDelta()와 getElapsedTime()

getDelta()와 getElapsedTime()주로 3D 라이브러리 Three.js에서 시간 흐름을 측정할 때 사용하는 메서드이다.두 메서드 모두 렌더링이나 애니메이션의 타이밍 조절에 유용하게 사용되지만, 목적과 결과값

wam6577.tistory.com

 

 

https://wam6577.tistory.com/159

 

삼각함수를 이용해 원형적인 움직임을 구현하기

Math.cos와 Math.sin은 삼각함수를 이용해 각도를 기반으로 한 값을 반환하는 JavaScript의 내장 함수이다.두 함수는 주로 그래픽, 애니메이션, 주기적인 패턴 생성 등에서 많이 사용된다.  Math.cos() 설

wam6577.tistory.com

 

 

 

저작자표시 변경금지 (새창열림)

'Frontend > Three.js' 카테고리의 다른 글

조명, PointLight _ 특정 지점에서 빛이 모든 방향으로 퍼져나가는 조명 효과_ 전구나 촛불 같은 광원을 표현  (0) 2024.11.10
조명, 그림자(Shadow) 처리하기  (0) 2024.11.08
삼각함수를 이용해 원형적인 움직임을 구현하기  (0) 2024.11.03
시간 흐름 측정, getDelta()와 getElapsedTime()  (0) 2024.11.03
조명, Light 기본 사용법 (AmbientLight, DirectionalLight, AxesHelper)  (0) 2024.10.31
    'Frontend/Three.js' 카테고리의 다른 글
    • 조명, PointLight _ 특정 지점에서 빛이 모든 방향으로 퍼져나가는 조명 효과_ 전구나 촛불 같은 광원을 표현
    • 조명, 그림자(Shadow) 처리하기
    • 삼각함수를 이용해 원형적인 움직임을 구현하기
    • 시간 흐름 측정, getDelta()와 getElapsedTime()
    wam
    wam

    티스토리툴바