새소식

인기 검색어

게임 개발/그래픽스

원 그리기

  • -

원의 반지름과 각도 세타를 이용해서

삼각형의 정의

주의: 각 삼각형의 vertex를 이용해 삼각형을 그릴때 시계방향으로 vertex를 입력해야 정상적으로 삼각형이 그려진다.

DirectX에서는 전통적으로 시계방향이 앞쪽

인덱스 버퍼

인덱스 버퍼

삼각형을 여러개 그릴때는 vertex 수를 가급적 줄이고 이웃해 있는 삼각형끼리 같은 vertex를 공유해서 사용하는것이 훨씬 효율적. 어떤 삼각형을 그려라 라는게, 어떤 vertex들을 순서대로 그려라 라는 의미로 vertex 들의 index가 나열된 버퍼 메모리 공간을 사용한다.

Rasterization::Rasterization(const int &width, const int &height)
    : width(width), height(height) {

    // 원을 그려봅시다.
    const auto radius = 0.5f;                   // 원의 반지름
    const auto center = vec3(0.0f, 0.0f, 1.0f); //원의 중심
    const size_t numTriangles = 5; // 삼각형 몇 개로 그릴지

    this->vertices.reserve(numTriangles + 1); // 중심 버텍스 추가
    this->colors.reserve(this->vertices.size());
    this->indices.reserve(numTriangles * 3);

    // 중심 버텍스의 위치와 색
    this->vertices.push_back(center);
    this->colors.push_back(vec3(1.0f, 0.0f, 0.0f));

    // 라디안(Radian) 2*PI는 360도를 의미합니다.
    // kTwoPi 이름은 구글 스타일 사용
    // https://google.github.io/styleguide/cppguide.html#Constant_Names
    const auto kTwoPi = 2.0f * 3.141592f;
    const auto deltaTheta = kTwoPi / float(numTriangles);

	// 여기서부터 this->vertices, colors, indices 결정
    // r*(cos, sin)
    
    // 가장자리 버텍스 정의
    for (size_t i = 0; i < numTriangles; i++)
    {
        const float theta = (float)i * deltaTheta;
        this->vertices.push_back(center +
                 vec3{cos(theta), sin(theta), 0.0f} * radius);
        this->colors.push_back(vec3(0.0f, 0.0f, 1.0f));
    }

    for (size_t i = 0; i < numTriangles - 1; i++)
    {
        // 시계방향 순서로 넣어야 함
        this->indices.push_back(0);
        this->indices.push_back(i + 2);
        this->indices.push_back(i + 1);
    }
    // 마지막 vertex는 첫번째 vertex 재활용
    this->indices.push_back(0);
    this->indices.push_back(1);
    this->indices.push_back(numTriangles);
}

삼각형 5개

 

삼각형 20개

삼각형 100개

'게임 개발 > 그래픽스' 카테고리의 다른 글

2차원 애니메이션  (0) 2023.11.07
2차원 변환  (0) 2023.11.07
삼각형 레스터화  (0) 2023.11.05
레스터화(rasterization)가 빠른 이유  (0) 2023.11.04
벡터와 포인트  (0) 2023.11.04
Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.