Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
SER431 Lecture 04
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Javier Gonzalez-Sanchez
PRO
August 27, 2018
Programming
0
380
SER431 Lecture 04
Advanced Graphics
Skyboxes
(201808)
Javier Gonzalez-Sanchez
PRO
August 27, 2018
Tweet
Share
More Decks by Javier Gonzalez-Sanchez
See All by Javier Gonzalez-Sanchez
CSC364 Lecture 10
javiergs
PRO
0
76
CSC364 Lecture 09
javiergs
PRO
0
94
CSC307 Lecture 09
javiergs
PRO
1
840
CSC307 Lecture 08
javiergs
PRO
0
670
CSC364 Lecture 08
javiergs
PRO
0
32
CSC307 Lecture 07
javiergs
PRO
0
550
CSC364 Lecture 07
javiergs
PRO
0
92
CSC307 Lecture 06
javiergs
PRO
0
680
CSC364 Lecture 06
javiergs
PRO
0
81
Other Decks in Programming
See All in Programming
KIKI_MBSD Cybersecurity Challenges 2025
ikema
0
1.3k
余白を設計しフロントエンド開発を 加速させる
tsukuha
7
2.1k
16年目のピクシブ百科事典を支える最新の技術基盤 / The Modern Tech Stack Powering Pixiv Encyclopedia in its 16th Year
ahuglajbclajep
5
1k
なぜSQLはAIぽく見えるのか/why does SQL look AI like
florets1
0
460
Data-Centric Kaggle
isax1015
2
770
SourceGeneratorのススメ
htkym
0
200
MDN Web Docs に日本語翻訳でコントリビュート
ohmori_yusuke
0
650
生成AIを使ったコードレビューで定性的に品質カバー
chiilog
1
270
Rust 製のコードエディタ “Zed” を使ってみた
nearme_tech
PRO
0
170
Honoを使ったリモートMCPサーバでAIツールとの連携を加速させる!
tosuri13
1
180
Best-Practices-for-Cortex-Analyst-and-AI-Agent
ryotaroikeda
1
110
なるべく楽してバックエンドに型をつけたい!(楽とは言ってない)
hibiki_cube
0
140
Featured
See All Featured
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
340
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
1
120
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
davidcarrasco
0
64
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
9.9k
Building a Scalable Design System with Sketch
lauravandoore
463
34k
My Coaching Mixtape
mlcsv
0
48
First, design no harm
axbom
PRO
2
1.1k
Tips & Tricks on How to Get Your First Job In Tech
honzajavorek
0
430
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
1
51
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.6k
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
710
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.6k
Transcript
jgs SER 431 Advanced Graphics Lecture 04: Skyboxes Javier Gonzalez-Sanchez
[email protected]
PERALTA 230U Office Hours: By appointment
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 1 jgs
Previously
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 2 jgs
A box
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 3 jgs
A box // create a triangulated cube Mesh* createCube() { Mesh *mesh = new Mesh; // Define 8 Vertexes mesh->dot_vertex.push_back(Vec3<GLfloat>( 0.0, 32.0, 32.0)); mesh->dot_vertex.push_back(Vec3<GLfloat>( 32.0, 32.0, 32.0)); mesh->dot_vertex.push_back(Vec3<GLfloat>( 32.0, 0.0, 32.0)); mesh->dot_vertex.push_back(Vec3<GLfloat>( 0.0, 0.0, 32.0)); // .. // Define 6 Faces; 2 triangles each mesh->face_index_vertex.push_back(0); mesh->face_index_vertex.push_back(3); mesh->face_index_vertex.push_back(1); mesh->face_index_vertex.push_back(1); mesh->face_index_vertex.push_back(3); mesh->face_index_vertex.push_back(2); // continue in the next slide 3 2 1 0
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 4 jgs
// Define 8 Vertexes and Define 6 Faces; 2 triangles each // Define texture vertex mesh->dot_texture.push_back(Vec2<GLfloat>(0.0, 1.0)); mesh->dot_texture.push_back(Vec2<GLfloat>(1.0, 1.0)); mesh->dot_texture.push_back(Vec2<GLfloat>(1.0, 0.0)); mesh->dot_texture.push_back(Vec2<GLfloat>(0.0, 0.0)); // Define texture faces for (int t = 0; t<6; t++) { mesh->face_index_texture.push_back(0);//0 mesh->face_index_texture.push_back(2);//1 mesh->face_index_texture.push_back(1);//2 mesh->face_index_texture.push_back(0);//0 mesh->face_index_texture.push_back(3);//2 mesh->face_index_texture.push_back(2);//3 } return mesh; } A Texture Outside the Box
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 5 jgs
What about inside the box?
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 6 jgs
Load Textures // Create texture from a DIB or BMP file void texture_from_file(GLuint *textureArray, const char * file) { BITMAPINFO *bitmapInfo; // Bitmap information GLubyte *bitmapBits; // Bitmap data if (!file) { cout << "texture file not found!" << endl; return;} // load image bitmapBits = load_bmp_file(file, &bitmapInfo); // setup texture glGenTextures(1, textureArray); glBindTexture(GL_TEXTURE_2D, *textureArray); glPixelStorei(GL_UNPACK_ALIGNMENT, 1);// must set to 1 for compact data gluBuild2DMipmaps(GL_TEXTURE_2D, 3, bitmapInfo->bmiHeader.biWidth, bitmapInfo->bmiHeader.biHeight, GL_BGR_EXT, GL_UNSIGNED_BYTE, bitmapBits ); }
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 7 jgs
A Texture for the Horizon
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 8 jgs
A texture for a Room https://www.facebook.com/asuphotos/photos/a.1636426986668999/1691991784445852/?type=3&theater
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 9 jgs
Texture Sources § Azimuth Chrome Plugin https://chrome.google.com/webstore/detail/azimuth-download-facebook/ https://www.360toolkit.co § Skyboxes Textures http://www.custommapmakers.org/skyboxes.php
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 10 jgs
Add a Texture to a Box void init() { // CREATE MESH DATA STRUCTURES mesh_cube = createCube(); // TEXTURES (Lecture 23 in SER 332) GLuint texture_array[6]; texture_from_file(&texture_array[0], "../../bmp files/top.bmp"); texture_from_file(&texture_array[1], "../../bmp files/left.bmp"); // ... // DISPLAY LIST skybox= meshToDisplayList(1, mesh_cube, texture_array); // CONFIGURE LIGHT }
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 11 jgs
GLuint meshToDisplayList(int id, Mesh* m, GLuint texture) { GLuint listID = glGenLists(id); glNewList(listID, GL_COMPILE); glEnable(GL_TEXTURE_2D); // Other options: GL_TEXTURE_1D, GL_TEXTURE_3D, GL_TEXTURE_CUBE_MAP glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_MODULATE); glBindTexture(GL_TEXTURE_2D, texture); glBegin(GL_TRIANGLES); // PER VERTEX NORMALS // TEXTURES if (!m->dot_texture.empty() && !m->face_index_texture.empty()) { glTexCoord2fv(&m->dot_texture[m->face_index_texture[i]].x); } // COLOR // VERTEX glEnd(); glDisable(GL_TEXTURE_2D); glEndList(); return listID; } Add a Texture to a Box
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 12 jgs
Texture inside a Box
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 13 jgs
Texture inside a Box https://www.facebook.com/asuphotos/photos/a.1636426986668999/1691991784445852/?type=3&theater
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 14 jgs
Quiz 1 § Work with your team § Create a Skybox § Submit your source code on Blackboard. Due: August 29, 11:59 PM
Javier Gonzalez-Sanchez | SER431 | Fall 2018 | 15 jgs
Test Yourselves Combine a sky box and a terrain. Allow the camera to be moved.
jgs SER431 Advanced Graphics Javier Gonzalez-Sanchez
[email protected]
Fall 2018 Disclaimer.
These slides can only be used as study material for the class SER431 at ASU. They cannot be distributed or used for another purpose.