Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
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
420
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
SER431 Lecture 04
Advanced Graphics
Skyboxes
(201808)
Javier Gonzalez-Sanchez
PRO
August 27, 2018
More Decks by Javier Gonzalez-Sanchez
See All by Javier Gonzalez-Sanchez
CSC310 Lecture 06
javiergs
PRO
0
22
CSC310 Lecture 05
javiergs
PRO
0
43
CSC310 Lecture 04
javiergs
PRO
0
42
CSC510 Lecture 03
javiergs
PRO
0
70
CSC310 Lecture 03
javiergs
PRO
0
49
CSC310 Lecture 02
javiergs
PRO
0
66
CSC310 Lecture 01
javiergs
PRO
1
84
CSC510 Lecture 01
javiergs
PRO
1
67
CSC307 Lecture 21
javiergs
PRO
0
75
Other Decks in Programming
See All in Programming
DynamoDBの基礎を振り返りながらベクトル検索機能を理解する
musan
3
270
RSSとCodexを使ってX投稿自動化してみた
ochtum
0
110
週末にAI-DLCを本気で回したら$1,600溶けた
hbashimizu
0
130
Snowflakeで業務アプリを作ろう。 Snowflakeのアプリ機能解説&実践ガイド
ayumu_yamaguchi
1
160
業務時間外もAIに働いてもらう話
colorful12
3
10k
フロントエンドUIフレームワークのこれまでとこれから
ssssota
1
860
Laravelのアプリケーションをどこにデプロイするか #ツナギメオフライン.9
akase244
0
120
Seeing Through Serverless: Observability for AWS Lambda with ADOT and CloudWatch Application Signals
seike460
PRO
1
130
AWS Step Functions 大規模並列の壁を越える / jaws-sonic-2026-niigata-step-functions
kasacchiful
PRO
0
400
GKE アップグレード前に知っておきたい Blue/Green と PDB の関係
stkk
0
160
Claude Codeを組織的に動かして月400PRを実現した話
happy_ryo
0
260
高専キャリア LT 発表内容
crysta1221
6
5.6k
Featured
See All Featured
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
signer
PRO
0
3.7k
Producing Creativity
orderedlist
PRO
348
41k
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
68
57k
How to build a perfect <img>
jonoalderson
1
6k
Test your architecture with Archunit
thirion
2
2.4k
16th Malabo Montpellier Forum Presentation
akademiya2063
PRO
0
370
Art, The Web, and Tiny UX
lynnandtonic
304
22k
Product Roadmaps are Hard
iamctodd
55
13k
Docker and Python
trallard
47
4.2k
The innovator’s Mindset - Leading Through an Era of Exponential Change - McGill University 2025
jdejongh
PRO
1
320
AI: The stuff that nobody shows you
jnunemaker
PRO
9
980
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.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.