# ThreeJS

qudgus21

들어가며 왜 관심을 가지게 되었나 학교를 (드디어) 졸업했다. 요즘은 그 동안 해보고 싶었던 개발을 마음껏 하면서 시간을 보내고 있다. 최근 노코드 툴을 사용한 게임 개발을 마치고, JS와 관련된 무언가를 해보고 싶었던 참에 회사 동료분께서 한 사이트를 공유해 주셨

baek_su

예전에 학교다닐때 졸업작품으로 opengl 을 사용해서 프로젝트를 진행한 적이 있었는데... 그때 생각이 나서 인프런 Three.js 강의 를 들으면서 정리하고 웹게임을 만들어 볼려고 한다.

samankeyc

무대만 만들어요

dlsals0530

threeJS와 유니티를 활용한 클래스 설명

wosk0106

Axes(축), Grid 헬퍼 내가 표현하고자 한 mesh 가 어디쯤에 있는지 알고 싶을 때 쓰면 좋겠다..? AxesHelper 별건 없다. three js 에서 이미 제공하고 있다. 축을 보여주는 놈. 생성자에 넘기는 숫자는 길이를 말한다. 자세한 건 아래 링

wosk0106

position (위치 변환) Vector3 사용법 scale (크기 변환) rotate (회전) 물체(Mesh)를 y 축으로 45도, x 축으로 20도를 돌린다고 가정하고 위와 같이 작성하면 아마 의도와 다르게 회전이 될 것이다. 이유인 즉슨 처음에 y 축으로

wosk0106

studiomeal 님의 'three.js로 시작하는 3D 인터랙티브 웹' 강의를 듣고 단순 정리한 것임을 밝힘쓰.(보는 이에 대한 친절을 염두하지 않은 글) requestAnimationFrame() 새로운 동작 또는 업데이트를 할 경우 렌더링 되기 전에 이 함수를

wosk0106

studiomeal 님의 'three.js로 시작하는 3D 인터랙티브 웹' 강의를 듣고 단순 정리한 것임을 밝힘쓰.(보는 이에 대한 친절을 염두하지 않은 글) Scene - 무대/장면 3d로 구현될 화면을 연극 무대로 가정한다면, 이 무대가 바로 scene (장면)

0hyo

Geometry는 material과 함께 mesh를 구성하는 요소이다. 3차원 객체의 형상 등을 정의한다. material은 3차원 객체의 색상이나 투명도 등을 정의한다. mesh는 3차원 객체를 화면에 표시하기 위한 클래스이며 Object3D의 파생 클래스이다.Obj

0hyo

BoxGeometry 정육면체 (가로, 세로, 깊이)면이 회색으로 채워지고 외곽선이 노란색으로 표시되는 육면체로 변경BoxGeometry는 가로, 세로, 깊이에 대한 크기와 함께 가로, 세로, 깊이 각각에 대한 분할(Segments)수로 정의, 지정하지 않으면 기본값이

0hyo

Mesh (Object3D) Mesh를 생성할 때 mesh의 형상을 정의하는 geometry와 색상이나 투명도 등을 지정할 수 있는 material이 필요하다. Geometry 3차원 오브젝트의 형상을 정의한다. 형상을 정의하기 위한 데이터는? 정점 형상을 정의하는

0hyo

Three.js는 웹페이지에 3D객체를 쉽게 렌더링하도록 도와주는 자바스크립트 3D 라이브러리이다.three.js는 WebGL을 사용하여 3D를 그린다.Javascript 를 이용하여 웹에서 사용이 가능한 그래픽 라이브러리 ( Web Graphics Library )단

9rganizedchaos

🙌🏻 해당 글은 Three.js Journey의 강의 노트입니다.

9rganizedchaos

🙌🏻 해당 글은 Three.js Journey의 강의 노트입니다.

9rganizedchaos

01 Introduction 가장 먼저 공부할 것은 scene 만들기, object 추가하기, materials 고르기, texture 추가하기 그리고 animation 추가하기! 그 다음 공부할 것은 geometry 만들기, 빛과 그림자, 3D object와의 인터랙

eunbani

threejsfundamentals.org

kimbyungchan

간단하고 쉽게 하프톤 효과를 만들어봅니다.

jihoson94

챕터 2로 넘어왔습니다. 지금까지 해왔던 내용은 매우 기초적이고 ThreeJS 어플리케이션이 어떻게 만들어질지 대충 알아봤습니다. 지금부터는 조금더 깊게 공부해보겠습니다. ThreeJS를 만들 때 사용할 주요 컴포넌트 복습겸 Scene에 무엇을 보여줄 때 필요한 4가지 요소를 정리해보겠습니다. | Component| Description | |---|...

jihoson94

Skelleton.html we'll at least need to load the Three.js library, three.js TrackballControls.js, which allows you to use your mouse to rotate and pan around the scenes. In the element of this page, ...

jihoson94

이전부터 HTML5 Canvas에 관심이 많았지만 굉장히 low level의 API에 압도당해서 너무 힘들것같아서 포기했다. 하지만 이번에 Three.js 라는 WebGL을 사용하는 웹기반의 3D 렌더링을 제공해주는 라이브러리를 보고 다시 공부해야겠다고 마음먹고 공부를