본문 바로가기

분류 전체보기985

Bounding Volumes 3D 그래픽스에서 Bounding Volumes(경계 볼륨)은 객체 또는 그룹의 외곽을 근사적으로 표현하는 기법입니다. 이는 객체의 충돌 감지, 가시성 테스트 및 렌더링 최적화와 같은 작업에서 유용하게 사용됩니다. Bounding Volumes는 다양한 형태로 사용될 수 있으며, 가장 일반적인 형태는 다음과 같습니다. 1. Bounding Box (경계 상자): Bounding Box는 가장 간단한 형태의 경계 볼륨입니다. 이는 3차원 공간에서 객체를 사각형 상자로 근사화하는 방법입니다. 상자의 크기는 최소한의 정보만을 포함하도록 결정되며, 일반적으로 객체의 최소 및 최대 꼭짓점을 둘러싸는 가장 작은 상자로 정의됩니다. 2. Bounding Sphere (경계 구): Bounding Sphere은 객체를.. 2023. 5. 13.
2D 이미지로 입체감을 주는 방법 무한하게 이어지는 배경이미지를 구현하는 개념부터 알아보자. 이는 캐러셀에서 loop를 하는 개념과도 동일하다. 하나의 이미지로는 무한하게 슬라이드 하지 못한다. 따라서 해당 뒤에 이어지거나 루프로 초기화가 될 이미지를 한번 더 붙여줘야 한다. 만약 앞 뒤로 이동하게 된다면 원본 이미지 배열 앞, 뒤에 각각 이어지는 이미지를 준비해 주자. 이를 canvas로 구현하면 다음과 같다. constructor(config){ this.img = config.img; this.speed = config.speed; this.height = App.height; this.width = App.height * (this.img.width / this.img.height); this.leftPos = {x: 0, y: .. 2023. 5. 8.
Antialiasing Transparency는 Antialiasing과 연관이 있다. 안티엘리어싱을 사용할지 말지는 Renderer가 결정한다. gpu 렌더러가 안티엘리어싱을 제공하면 사용할 수 있고 그렇지 않다면 사용하지 못하는 것이다. 여기서 시작하여 어떤 물체가 투명하냐 불투명하냐를 결정하는 것은 Material에서 결정되게 된다. 이 둘은 무슨 관계일까? 그려지는 물체가 투명도가 있으면 원래 그려져 있던 것과 새롭게 그려지는 것을 블렌딩 하는 과정에서 투명도를 어떻게 반영할 것인가를 만들어서 그려냅니다. 이 투명도는 GPU의 블렌딩이 해주어야 합니다. 안티앨리어싱이 없으면 계단현상이 일어난다. 이는 픽셀이 생각보다 크기 때문이다. 해상도가 정말 좋다면 안티앨리어싱을 안 해도 된다. 다만 어찌 됐는 계단현상을 발생할 것.. 2023. 5. 6.
Texture Three.js에서 Texture는 Materia에 붙여서 사용하게 된다. 물체에 그림을 어떻게 입혀야 할까? gemetric modeling과 Texture Mapping이 있다. vertex 하나하나 geometry를 모델링하는 것보다 텍스처를 매핑하는 것이 훨씬 더 효율적이다. geometric 모델링은 각 버텍스 하나하나 마다 색을 할당한다. 얼마나 많은 연산이 일어나야 할까? 대신 texture mapping은 실제 이미지를 표현에 감싸는 식으로 동작한다. 이러한 이미지를 실제로 모델의 어느 부분에 붙여야 하는지 알려주는 행위가 필요하다. 이를 이미지의 uv좌표와 모델의 버텍스 좌표가 어디에 매핑되는지 알려주어야 한다. 다양한 이미지가 있을 수 있다. gray scale, color 등등.. 얻.. 2023. 5. 6.
Light Three.js에서 Light를 추가하면 할수록 성능이 떨어진다. 그 이유는 간단하다. 빛이 하나 있을 때 버텍스에 대해 버텍스 수만큼만 빛을 처리하면 되는데 빛이 여러 개 있는 경우 모든 버텍스에 빛의 수만큼 곱한 연산이 필요하기 때문이다. 그렇기에 빛을 사용할 때 조심해서 사용해야 한다. 기본적인 조명 모델에 대해 알아보자. 1. Light Radiation 네온사인, 태양과 같이 자체적으로 빛을 내는 모델이 있다. 그러면 단색으로 칠하기만 하면 된다. 비슷하게 surface Ambient가 있다. 모든 물체가 이 정도의 에너지를 가진다고 가정하는 것이다. 기본적으로 완전히 빛을 차단하는 것은 지구에서 불가능하다. 난반사로 인해 빛의 세기가 감소하더라도 아주 조금이라도 모든 곳에 닿기 때문이다. 물론.. 2023. 5. 6.
flat, smooth shading 지오메트리의 노말 벡터를 어떻게 주느냐에 따라 결정이 된다. Webgl에서는 geometry안에 각 각의 버텍스마다 노말벡터를 정한다. three.js에서는 필요에 따라 material을 결정하게 된다. three.js에서는 Material에서 falt, smooth shading 설정 값에 따라 각 버텍스의 노말 벡터의 값이 변경되면서 적용됩니다. 예제를 보자. 3개의 구를 만들고 Material은 MeshPhongMaterial을 사용하여 적절한 광원을 계산하도록 한다. Phong Model은 간단하고 빠른 계산을 위해 사용되는 모델이다. 3가지 요소가 있고 이는 diffuse, specular, ambient 값을 계산한다. 그리고 4가지 요소의 벡터를 사용한다. 버텍스의 위치와 버텍스의 노말 벡터.. 2023. 5. 6.
View 보호되어 있는 글 입니다. 2023. 5. 5.
Module 파이썬은 수 많은 모듈이 있다. 모듈에는 함수, 상수 또는 클래스들이 모여져 있는 집합체이다. 모듈? 패키지? 라이브러리? 이를 간단하게 정리하면 다음과 같다. 모듈은 클래스 ,함수, 상수의 집합이라고 하자. 이러한 모듈들이 여러 주제지향적으로 묶여있다고 하자. 이러한 모듈의 집합을 패키지라고 한다. 이러한 패키지들이 여러 개로 모여있고 하나의 큰 분야를 차지하면 라이브러리라고 할 수 있다. 파이썬에서 모듈을 사용하기 위해선 다음과 같은 구문을 사용합니다. import 모듈이름 [as 별칭] 이는 파이썬 모듈을 프로그램 내부에서 사용할 수 있게 네임스페이스에 추가하는 명령어 입니다. 만약 선택적으로 일부 변수와 메서드만 가져오고 싶다면 다음과 같이 한다. from 모듈이름 import 메소드1, [함수/.. 2023. 5. 5.
class 파이썬은 객체지향 프로그래밍을 지원한다. 이를 위해 잠시 객체지향에 대해 매우 짧게 정리하고 파이썬이 이를 위해 어떤 도구를 제공해 주고 이에 대한 문법을 알아보자. 객체지향 객체지향 프로그래밍에 대해 어떻게 정의를 내릴까? 아무것도 몰랐을 때 객체지향은 실세계를 반영하여 복잡한 구조를 현실적으로 쉽고 사람에 이해의 기반하여 유지보수하기 쉽고 실용성 있게 개발하기 위한 방법론이라고 공부했던 기억이 있고 이후 객체지향의 특징과 각 언어마다 제공해 주는 특징을 익히기 바빴다. 이제 와서 다시 생각해 보니 위 설명은 너무나도 추상적이다. 그렇다 객체지향은 매우 추상적 투성이었다. 현실세계를 소프트웨어 세계로 투영한다는 것 자체가 말이 안 된다. 현실세계는 더욱 복잡하고 이를 한계가 있는 기술인 소프트웨어로 설.. 2023. 5. 5.
function 파이썬에서 함수의 형태를 우선 알아보자. def functionName(arg, arg2): 명령 블록 define의 약자인 def의 키워드와 함수이름, 함수 매개변수와 세미콜론으로 정의한다. 그 밑에 탭을 통한 구분밑에 명령블록을 작성하면 된다. 원뿔의 부피를 계산하는 함수를 작성해 보자. 매개 변수에 대한 검증하는 부분은 제외하고 작성하자. def coneVol(radius, height): vol = 1/3 * 3.14 * r ** 2 * h print("부피", vol) 만약 반환값이 있는 경우 혹시 반환타입을 적어주는 문법이 있을까? 내장 함수의 format함수를 사용해 보자. format은 정렬방향, 필드 폭, 소수점 이하 자릿수, 데이터타입을 넣어주면 된다. def coneVol(radius.. 2023. 5. 5.

티스토리툴바