Senin, 25 Mei 2015

Membuat Objek Balok 3D Solid / Padat

Siang hari senin, semua orang ngak suka hari senin, ngak tau kenapa...


Siang semuanya...walaupun agak terik hari ini dan agak panas tetapi postingan harus jalan terus...
Hari ini aku akan meneruskan obrolan tentang  objek 3D balok wire / kawat yang sebelumnya telah aku bahas. Dan kali ini aku akan membahas tentang pemberian tekstur pada balok 3D.


Hasil program yang kita aka pelajari pada hari ini tampak seperti gambar di atas. Ok langsung saja kita mulai belajar (udah siapin kopi atau teh belum...siapin ya biar nyantai).

Cara paling sederhana untuk memberi tekstur sebuah balok adalah keenam polygon dari balok tersebut ditempel dengan tekstur yang sama (kubus warna merah di atas).

Ada cara lain yang dapat dilakukan selain cara di atas, dengan cara ini rekan-rekan dapat membuat kreasi tersendiri, coba perhatikan gambar 1 di bawah ini.


Gambar di atas menunjukan jaring-jaring balok yang dibentangkan, perhatikan JT=(2xt)+(2xp). JT adalah jarak terpanjang yang dihitung berdasarkan (2xtinggi) +(2xpanjang) dengan kondisi lebar <= (2xpanjang).


Perhatikan gambar 2, angka 0 sampai dengan 7 pada gambar di atas adalah angka-angka yang menunjukan urutan array tempat menyimpan vertex-vertex polygon, contoh polygon muka balok, vertex-vertex-nya disimpan pada array 0, 1, 2, 3. Berdasarkan gambar 1 dan gambar 2 maka dapat dibuat tabel titik koordinat x dan titik koordinat y dari texture yang akan ditempelkan ke masing-masing polygon balok.


Setelah tabel 1 selesai dibuat maka tekstur koordinat dengan titik x dan y untuk masing-masing vertex polygon akan didapat, tetapi ada satu masalah lagi yang harus diselesaikan karena tekstur yang dipakai untuk tekstur balok hanya mempunyai jarak tinggi dan lebar sebesar 1 satuan, sehingga diperlukan skala untuk menyelesaikan masalah ini.


Pada gambar 3 terlihat bahwa jaring-jaring balok ditempelkan pada sebuah tekstur dengan koordinat (0,0), (1,0), (1,1), dan (0,1). Jika para Pembaca mempunyai balok dengan p=1.0, tinggi=1.5, dan lebar=0.8, maka

JT   =  (2xtinggi) + (2xpanjang)
     =  (2x1.5) + (2x1.0)
     =  3.0 + 2.0
     =  5.0

Dan jika panjang dari texture ditentukan sebesar 10.0, maka skala akan dapat dihitung dengan cara:

skala = panjang texture
JT      panjang texture yang ditentukan

skala = 1.0
5.0     10.0

skala = 5.0 x 1.0
        10.0

skala = 0.5

(nilai 10.0 ditentukan oleh ogut, rekan-rekan bisa menentukan sendiri nilai panjang texture untuk membuat skala yang diinginkan)
Dengan skala 0.5 berarti 4 titik koordinat texture untuk polygon muka balok adalah:

X = (tinggi/JT) x skala = (1.5/5.0) x 0.5 = 0.15
Y = 0.0                                   = 0.0

X = (tinggi/JT) x skala = (1.5/5.0) x 0.5 = 0.15
Y = (tinggi/JT) x skala = (1.5/5.0) x 0.5 = 0.15

X = (tinggi+panjang)/JTxskala = (1.5+1.0)/5.0x0.5 = 0.25
Y = (tinggi/JT) x skala       = (1.5/5.0) x 0.5   = 0.15

X = (tinggi+panjang)/JTxskala = (1.5+1.0)/5.0x0.5 = 0.25
Y = 0.0                                           = 0.0

Anda dapat menambahkan dx dan dy (gambar 3) untuk mengatur peletakan dari jaring-jaring balok di tengah-tengah texture, tetapi ingat jangan sampai nilai dx dan dy terlalu besar, sebab akan mengakibatkan nilai x dan nilai y melebihi 1.0.
Berikut ini adalah potongan program untuk menentukan nilai x dan y tekstur koordinat dan sub program untuk menggambar balok yang diberi tekstur (balok padat/solid).

void load_Balok_TextureKoordinat(float panjang, float tinggi, float lebar, float JT, float skala, float dx, float dy, int tipe_text, Koordinat TK_Balok[24])
{
...
...
...
TK_Balok[0].X = ((tinggi / JT) * skala) + dx;
TK_Balok[0].Y = dy;
TK_Balok[1].X = ((tinggi / JT) * skala) + dx;
TK_Balok[1].Y = ((tinggi / JT) * skala) + dy;
TK_Balok[2].X = (((tinggi+panjang) / JT) * skala) + dx;
TK_Balok[2].Y = ((tinggi / JT) * skala) + dy;
TK_Balok[3].X = (((tinggi+panjang) / JT) * skala) + dx;
TK_Balok[3].Y = dy;
TK_Balok[4].X = TK_Balok[2].X;
TK_Balok[4].Y = TK_Balok[2].Y;
TK_Balok[5].X = ((((2*tinggi)+panjang) / JT) * skala) + dx;
TK_Balok[5].Y = ((tinggi / JT) * skala) + dy;
TK_Balok[6].X = ((((2*tinggi)+panjang) / JT) * skala) + dx;
TK_Balok[6].Y = (((tinggi+lebar) / JT) * skala) + dy;
TK_Balok[7].X = (((tinggi+panjang) / JT) * skala) + dx;
TK_Balok[7].Y = (((tinggi+lebar) / JT) * skala) + dy;
TK_Balok[8].X = (((tinggi+panjang) / JT) * skala) + dx;
TK_Balok[8].Y = ((((2*tinggi)+lebar) / JT) * skala) + dy;
TK_Balok[9].X = TK_Balok[7].X;
TK_Balok[9].Y = TK_Balok[7].Y;
TK_Balok[10].X = ((tinggi / JT) * skala) + dx;
TK_Balok[10].Y = (((tinggi+lebar) / JT) * skala) + dy;
TK_Balok[11].X = ((tinggi / JT) * skala) + dx;
TK_Balok[11].Y = ((((2*tinggi)+lebar) / JT) * skala) + dy;
TK_Balok[12].X = TK_Balok[10].X;
TK_Balok[12].Y = TK_Balok[10].Y;
TK_Balok[13].X = dx;
TK_Balok[13].Y = (((tinggi+lebar) / JT) * skala) + dy;
TK_Balok[14].X = dx;
TK_Balok[14].Y = ((tinggi / JT) * skala) + dy;
TK_Balok[15].X = TK_Balok[1].X;
TK_Balok[15].Y = TK_Balok[1].Y;
TK_Balok[16].X = TK_Balok[1].X;
TK_Balok[16].Y = TK_Balok[1].Y;
TK_Balok[17].X = TK_Balok[2].X;
TK_Balok[17].Y = TK_Balok[2].Y;
TK_Balok[18].X = TK_Balok[7].X;
TK_Balok[18].Y = TK_Balok[7].Y;
TK_Balok[19].X = TK_Balok[10].X;
TK_Balok[19].Y = TK_Balok[10].Y;
TK_Balok[20].X = (((2*(tinggi+panjang)) / JT) * skala) + dx;
TK_Balok[20].Y = ((tinggi / JT) * skala) + dy;
TK_Balok[21].X = TK_Balok[5].X;
TK_Balok[21].Y = TK_Balok[5].Y;
TK_Balok[22].X = TK_Balok[6].X;
TK_Balok[22].Y = TK_Balok[6].Y;
TK_Balok[23].X = (((2*(tinggi+panjang)) / JT) * skala) + dx;
TK_Balok[23].Y = (((tinggi+lebar) / JT) * skala) + dy;
...
...
...

}

void balok_solid(Vertex read_Balok[8], Koordinat TK_Balok[24], int index_bitmap)
{
switch (index_bitmap)
{
case 0:
glBindTexture(GL_TEXTURE_2D, texture_merah);
break;
case 1:
glBindTexture(GL_TEXTURE_2D, texture_biru);
break;
}


glBegin(GL_POLYGON);
glTexCoord2f(TK_Balok[0].X, TK_Balok[0].Y);
glVertex3f(read_Balok[0].VX, read_Balok[0].VY, read_Balok[0].VZ);

glTexCoord2f(TK_Balok[1].X, TK_Balok[1].Y);
glVertex3f(read_Balok[1].VX, read_Balok[1].VY, read_Balok[1].VZ);

glTexCoord2f(TK_Balok[2].X, TK_Balok[2].Y);
glVertex3f(read_Balok[2].VX, read_Balok[2].VY, read_Balok[2].VZ);

glTexCoord2f(TK_Balok[3].X, TK_Balok[3].Y);
glVertex3f(read_Balok[3].VX, read_Balok[3].VY, read_Balok[3].VZ);
glEnd();

glBegin(GL_POLYGON);
glTexCoord2f(TK_Balok[4].X, TK_Balok[4].Y);
glVertex3f(read_Balok[2].VX, read_Balok[2].VY, read_Balok[2].VZ);

glTexCoord2f(TK_Balok[5].X, TK_Balok[5].Y);
glVertex3f(read_Balok[3].VX, read_Balok[3].VY, read_Balok[3].VZ);

glTexCoord2f(TK_Balok[6].X, TK_Balok[6].Y);
glVertex3f(read_Balok[4].VX, read_Balok[4].VY, read_Balok[4].VZ);

glTexCoord2f(TK_Balok[7].X, TK_Balok[7].Y);
glVertex3f(read_Balok[5].VX, read_Balok[5].VY, read_Balok[5].VZ);
glEnd();

glBegin(GL_POLYGON);
glTexCoord2f(TK_Balok[8].X, TK_Balok[8].Y);
glVertex3f(read_Balok[4].VX, read_Balok[4].VY, read_Balok[4].VZ);

glTexCoord2f(TK_Balok[9].X, TK_Balok[9].Y);
glVertex3f(read_Balok[5].VX, read_Balok[5].VY, read_Balok[5].VZ);

glTexCoord2f(TK_Balok[10].X, TK_Balok[10].Y);
glVertex3f(read_Balok[6].VX, read_Balok[6].VY, read_Balok[6].VZ);

glTexCoord2f(TK_Balok[11].X, TK_Balok[11].Y);
glVertex3f(read_Balok[7].VX, read_Balok[7].VY, read_Balok[7].VZ);
glEnd();

glBegin(GL_POLYGON);
glTexCoord2f(TK_Balok[12].X, TK_Balok[12].Y);
glVertex3f(read_Balok[6].VX, read_Balok[6].VY, read_Balok[6].VZ);

glTexCoord2f(TK_Balok[13].X, TK_Balok[13].Y);
glVertex3f(read_Balok[7].VX, read_Balok[7].VY, read_Balok[7].VZ);

glTexCoord2f(TK_Balok[14].X, TK_Balok[14].Y);
glVertex3f(read_Balok[0].VX, read_Balok[0].VY, read_Balok[0].VZ);

glTexCoord2f(TK_Balok[15].X, TK_Balok[15].Y);
glVertex3f(read_Balok[1].VX, read_Balok[1].VY, read_Balok[1].VZ);
glEnd();

glBegin(GL_POLYGON);
glTexCoord2f(TK_Balok[16].X, TK_Balok[16].Y);
glVertex3f(read_Balok[1].VX, read_Balok[1].VY, read_Balok[1].VZ);

glTexCoord2f(TK_Balok[17].X, TK_Balok[17].Y);
glVertex3f(read_Balok[2].VX, read_Balok[2].VY, read_Balok[2].VZ);

glTexCoord2f(TK_Balok[18].X, TK_Balok[18].Y);
glVertex3f(read_Balok[5].VX, read_Balok[5].VY, read_Balok[5].VZ);

glTexCoord2f(TK_Balok[19].X, TK_Balok[19].Y);
glVertex3f(read_Balok[6].VX, read_Balok[6].VY, read_Balok[6].VZ);
glEnd();

glBegin(GL_POLYGON);
glTexCoord2f(TK_Balok[20].X, TK_Balok[20].Y);
glVertex3f(read_Balok[0].VX, read_Balok[0].VY, read_Balok[0].VZ);

glTexCoord2f(TK_Balok[21].X, TK_Balok[21].Y);
glVertex3f(read_Balok[3].VX, read_Balok[3].VY, read_Balok[3].VZ);

glTexCoord2f(TK_Balok[22].X, TK_Balok[22].Y);
glVertex3f(read_Balok[4].VX, read_Balok[4].VY, read_Balok[4].VZ);

glTexCoord2f(TK_Balok[23].X, TK_Balok[23].Y);
glVertex3f(read_Balok[7].VX, read_Balok[7].VY, read_Balok[7].VZ);
glEnd();
}

Sekarang aku akan memberikan sebuah contoh lagi untuk tekstur sebuah balok dengan jaring-jaring balok yang berbeda, tetapi cara menghitung titik x dan titik y tekstur koordinatnya sama.


JT=(2xp)+(2xl) dengan kondisi t<=(2xp) maka tabel yang dapat dibuat.


Berdasarkan tabel tersebut maka sub program untuk menentukan titik x dan y texture koordinat akan menjadi sebagai berikut

void load_Balok_TextureKoordinat(float panjang, float tinggi, float lebar, float JT, float skala, float dx, float dy, int tipe_text, Koordinat TK_Balok[24])
{
...
...
...
TK_Balok[0].X = dx;
TK_Balok[0].Y = ((lebar / JT) * skala) + dy;
TK_Balok[1].X = dx;
TK_Balok[1].Y = (((lebar+tinggi) / JT) * skala) + dy;
TK_Balok[2].X = ((panjang / JT) * skala) + dx;
TK_Balok[2].Y = (((lebar+tinggi) / JT) * skala) + dy;
TK_Balok[3].X = ((panjang / JT) * skala) + dx;
TK_Balok[3].Y = ((lebar / JT) * skala) + dy;
TK_Balok[4].X = TK_Balok[2].X;
TK_Balok[4].Y = TK_Balok[2].Y;
TK_Balok[5].X = TK_Balok[3].X;
TK_Balok[5].Y = TK_Balok[3].Y;
TK_Balok[6].X = (((panjang+lebar) / JT) * skala) + dx;
TK_Balok[6].Y = ((lebar / JT) * skala) + dy;
TK_Balok[7].X = (((panjang+lebar) / JT) * skala) + dx;
TK_Balok[7].Y = (((lebar+tinggi) / JT) * skala) + dy;
TK_Balok[8].X = TK_Balok[6].X;
TK_Balok[8].Y = TK_Balok[6].Y;
TK_Balok[9].X = TK_Balok[7].X;
TK_Balok[9].Y = TK_Balok[7].Y;
TK_Balok[10].X = ((((2*panjang)+lebar) / JT) * skala) + dx;
TK_Balok[10].Y = (((lebar+tinggi) / JT) * skala) + dy;
TK_Balok[11].X = ((((2*panjang)+lebar) / JT) * skala) + dx;
TK_Balok[11].Y = ((lebar / JT) * skala) + dy;
TK_Balok[12].X = TK_Balok[10].X;
TK_Balok[12].Y = TK_Balok[10].Y;
TK_Balok[13].X = TK_Balok[11].X;
TK_Balok[13].Y = TK_Balok[11].Y;
TK_Balok[14].X = (((2*(panjang+lebar)) / JT) * skala) + dx;
TK_Balok[14].Y = ((lebar / JT) * skala) + dy;
TK_Balok[15].X = (((2*(panjang+lebar)) / JT) * skala) + dx;
TK_Balok[15].Y = (((lebar+tinggi) / JT) * skala) + dy;
TK_Balok[16].X = TK_Balok[1].X;
TK_Balok[16].Y = TK_Balok[1].Y;
TK_Balok[17].X = TK_Balok[2].X;
TK_Balok[17].Y = TK_Balok[2].Y;
TK_Balok[18].X = ((panjang / JT) * skala) + dx;
TK_Balok[18].Y = ((((2*lebar)+tinggi) / JT) * skala) + dy;
TK_Balok[19].X = dx;
TK_Balok[19].Y = ((((2*lebar)+tinggi) / JT) * skala) + dy;
TK_Balok[20].X = TK_Balok[0].X;
TK_Balok[20].Y = TK_Balok[0].Y;
TK_Balok[21].X = TK_Balok[3].X;
TK_Balok[21].Y = TK_Balok[3].Y;
TK_Balok[22].X = ((panjang / JT) * skala) + dx;
TK_Balok[22].Y = dy;
TK_Balok[23].X = dx;
TK_Balok[23].Y = dy;
...
...
...
}

NB.
Jika kondisi t<=(2xp) tidak terpenuhi maka skala harus dibuat kecil agar hasil akhir titik x dan y tidak melebihi 1.0.

Selesai dah urusan memberi tekstur pada balok 3D. Kode program secara lengkap tidak ogut sertakan di bawah ini, tapi project lengkap bisa rekan-rekan download.

Terima kasih sudah  bersabar, lain waktu ogut akan bahas kelanjutan dari balok 3D ini.


Heriady
heriady.yoh@gmail.com


Download program balok 3D solid


Sumber
Artikel ini bersumber pada buku Pemrograman Grafik 3D menggunakan C & OpenGL, karangan Heriady (halaman 56 s/d 66)












Artikel terkait
Program balok 3D wire / kawat
Program meja 3D