tinyobjloaderによって読み込んだ情報で描画する方法

Question

3DCGモデル（WavefrontOBJ/.obj）をOpenGLによって読み込んで描画をしたいのですが、そのモデルを描画するための実装に詰んでいるところです。

読み込みはhttps://github.com/syoyo/tinyobjloader/blob/master/tiny_obj_loader.h
のtinyobjloader.hと、
https://github.com/syoyo/tinyobjloader/blob/master/examples/callback_api/main.cc
のmain.ccを使っています。
（言語はC++です。）

読み込みが出来たのは良いのですが、ここから
１．windowを生成（GLFWを利用して実現）
２．投資投影手法で描画
と取り組みたいのですが、２を実現するためのコーディングに詰んでおります。

現状の私の手元のコードは上記のmain.ccそのままです。
読み取った頂点座標情報等をどう上手く利用して描画に持ち込めばいいのか…。

調べても作業が進まず、C++やOpenGLに関して勉強不足を大変痛感しております。
基礎から学んでいる途中でもあり、１週間経っても進まなかったので助言を賜りたく投稿いたしました。

超初心者ですがご教授のほど、よろしくお願いいたします。

Answer 1

obj ファイルに入っている情報は、各ポリゴンの各頂点ごとの「座標 (x, y, z)」「法線 (x, y, z)」「色 (r, g, b)」「テクスチャ座標 (x, y)」です。

基本的にこのポリゴンは三角形であり、複雑なオブジェクトも三角形が集まってできています。

なので、まずは以下のコードを作成してみて、それを objloader で取得できた三角形分繰り返すようにあとで変更すればいいかと思います。

• 三角形のポリゴンを描画する OpenGL のコード
• 三角形のポリゴンにテクスチャを適用して描画する OpenGL のコード
• 透視投影変換やライトの設定

tinyobjloader で各ポリゴンの情報を取得する例

1つの頂点は複数の面で共有されているため、各頂点の情報にはインデックス経由でアクセスします。
(同じ頂点でも面ごとに情報を持つようにすると、重複して無駄なため、obj ファイルフォーマットではそうなっている。)

tinyobj::attrib_t attrib;
std::vector<tinyobj::shape_t> shapes;
std::vector<tinyobj::material_t> materials;
std::string error;

bool ret = tinyobj::LoadObj(
    &attrib,
    &shapes,
    &materials,
    &error,
    R"(test.obj)");

if (!error.empty())
    std::cerr << error << std::endl;

if (!ret)
    exit(1);

for (const auto &shape : shapes) {
    // shape の名前
    std::cout << shape.name << std::endl;

    size_t index_offset = 0;  // インデントのオフセット
    for (size_t f = 0; f < shape.mesh.num_face_vertices.size(); f++) {
        // 面 f を構成sする頂点の数
        int num_vertices = shape.mesh.num_face_vertices[f];

        glBegin(GL_TRIANGLES);
        for (size_t v = 0; v < num_vertices; v++) {
            // access to vertex
            tinyobj::index_t idx = shape.mesh.indices[index_offset + v];

            // 頂点の座標
            float vx = attrib.vertices[3 * idx.vertex_index + 0];
            float vy = attrib.vertices[3 * idx.vertex_index + 1];
            float vz = attrib.vertices[3 * idx.vertex_index + 2];

            // 頂点の法線
            float nx = attrib.normals[3 * idx.normal_index + 0];
            float ny = attrib.normals[3 * idx.normal_index + 1];
            float nz = attrib.normals[3 * idx.normal_index + 2];

            // 頂点のテクスチャ座標
            tinyobj::real_t tx =
                attrib.texcoords[2 * idx.texcoord_index + 0];
            tinyobj::real_t ty =
                attrib.texcoords[2 * idx.texcoord_index + 1];

            // 頂点の色
            float red = attrib.colors[3 * idx.vertex_index + 0];
            float green = attrib.colors[3 * idx.vertex_index + 1];
            float blue = attrib.colors[3 * idx.vertex_index + 2];
        }
        index_offset += num_vertices;

        // per-face material
        shape.mesh.material_ids[f];
    }
}