1.3 2次元図形の描画 1.3.1図形の描画方法 点、線、多角形平面

Ⅱ- 1
1.3 ２次元図形の描画
1.3.1図形の描画方法
点、線、多角形平面（ポリゴン)の描画方法
glBegin（図形描画種類の指定）; ←セミコロンを忘れずに
glVertex3f(x0,y0,z0);
V1
V0
glVertex3f(x1,y1,z1);
V2
・・・
V4
glVertex3f(xn,yn,zn);
V3
glEnd( );
GL_LINE_LOOP
glVertex3f(x,y,z); は図形の頂点のxyz座標を設定する関数で，
glBegin行とglEnd行の間に全ての頂点を記述する．
glBegin(GL_POINTS); 点を生成する．
glBegin(GL_LINES); 頂点を２つずつ結んでできる直線を生成する．
glBegin(GL_POLYGON);頂点を結んでできる塗りつぶした多角形平面を生成する．
Ⅱ- 2
OpenGLの基本図形（I）
V1
V1
V0
V2
V4
V2
V4
V3
V3
GL_POINTS
V1
GL_LINES
V1
V0
V2
V0
V4
V3
GL_LINE_STRIP
V0
V2
V4
V3
GL_LINE_LOOP
glBegin（図形描画種
類の指定）;
glVertex3f(x0,y0,z0);
glVertex3f(x1,y1,z1);
・・・
glVertex3f(xn,yn,zn);
glEnd( );
Vn(xn,yn,zn)
Ⅱ- 3
OpenGLの基本図形（II）
V3
V1
V0
V2
V2
V4
V1
V4
V3
V0
GL_POLYGON
GL_TRIANGLE_FAN
V2
V2
V0
V1
V3
V4
V5
GL_TRIANGLE_STRIP
V2
V0
V1
V3
V4
V5
GL_QUAD_LOOP
V6
V7
Ⅱ- 4
プログラムc1-2.cを各自の01フォルダにコピーし，コンパ
イル・実行して動作を確認する(ウィンドウの中央に白色
で塗りつぶされた四角形を描くプログラム)．c1-2.pdf
実行！
y
(-1,1,0)
x
y
1
z
0.5
-0.5
0.5
-1
-1
-0.5
1x
スクリーン座標系
（ウィンドウ）
(1,-1,0)
ワールド座標系
（コンピュータ内部）
Ⅱ- 5
練習問題１－２：
１）プログラムc1-2.cをコピーして，図形の頂点ごとにつぎの順番で異なる色を
表示できるように修正する（プログラム名はp1-2-1.cとする）．
赤、黄色、緑、青
色の指定：glColor3f(R,G,B); をglVertex3fの直前に呼ぶ
(R,G,Bは0.0~1.0の実数）
２）幅２ドットと８ドットの線分を描け
（プログラム名はp1-2-22.c，p1-2-28.cとする）
glLineWidth(float width)をglBeginより前に呼ぶこと（widthは線分のドット数）
３）３角形，４角形，５角形ポリゴンを描け
プログラム名はp1-2-33.c，p1-2-34.c，p1-2-35.cとする）
ヒント：正多角形とする場合その頂点は次式で計算できる(PAI2=2π=2*3.14…)
半径 r 角数 pnum
x0=r*cos(PAI2*((double)i)/((double)pnum));
y0=r*sin(PAI2*((double)i)/((double)pnum));
x1=r*cos(PAI2*((double)(i+1))/((double)pnum));
y1=r*sin(PAI2*((double)(i+1))/((double)pnum));
解答例１ ２ ３
Ⅱ- 6
OpenGLの関数名規則
gl Vertex 3f ( x, y, z)
接頭語：ライブラリの種類を表わす．小文字． GL，GLU，GLUTのそれぞれ
に応じて gl，glu，glut
コマンド名：処理内容を反映した名前がつけられる．大文字ではじまる
接尾語：数字とアルファベットからなる．数字は引数の数，アルファベットは引
数の型．
f: float d: double i: int(long) s: int(short)
v:vectorは引数に配列を指定する場合に用いる．
上記の例では，GLの関数で，頂点に関する処理を行ない，float型引数を３
個持つ．
glColor3f(R,G,B)：図形を描画する前に，赤，緑，青の濃度を
0.0～1.0で設定する（ 0-255ではないので注意）．
Ⅱ- 7
３次元図形の描画と隠面処理
2.
2.1. ワールド座標系と投影法
右手系、左手系：ｘ軸、ｙ軸に対し、ｚ軸の正の方向をどちらにとるかは２とおりある。
y軸
z軸
0
z軸
右手系：ｘ軸をy軸に重ねるように時計方
向に回転したとき（この図では向こう側か
らみたとき）、右ネジが進む方向にｚ軸の
正の方向がとられる場合（手前）右手系と
呼ぶ。通常は右手系がとられる。
右
x軸
Ⅱ- 8
ポリゴンの頂点の順番と表面の定義
頂点の順番によって、面の表裏が決められている。
図（教科書1.9）に示すように、頂点の順番に右ネジを回した
とき、ネジが進む方向の面を表面と定義するのが一般的
正方向
V1
V2
V0
V3
Ⅱ- 9
投影法：
ワールド座標系で表わされた３次元物体を２次元スクリーン座標系に映すことを投影
と呼ぶ。
A
A
A’
A’
B
B
B’
B’
投影面
（スクリーン）
平行投影：
投影面
（スクリーン）
投影中心
透視投影：
平行投影：物体の寸法を正確に表わすことができる。
透視投影（中心投影）：視覚系と同様に遠近感がでて現実に
近い画像が生成される
Ⅱ-10
平行投影：
透視投影：
Ⅱ-11
視点と物体との距
離が近い場合物
体の奥行きに応じ
て投影面（図中の
半透明緑面） との
交点の位置は異
なるが、視点が遠
い場合にはほと
んど影響しなくな
る.
投影面（視野面）
透視投影
（中心投影）
視線（投影線）
視点（投影中心）
平行投影
投影方向
∞
無限遠
Ⅱ-
三角柱を真横から見たとき、近くでは見る
位置(A,B)を変えると形状が変わって見え
るが、遠くから見るとほとんど変化しない。
（A）
（B）
（A）
（B）
（∞）
（∞）
Ⅱ-13
ワールド座標系：コンピュータ内部の３次元座標系
スクリーン座標系：ディスプレイ上の２次元平面の座標系
後方クリップ面
(1)ローカル座標系：各物体単位で記述
(2)ワールド座標系：全ての物体を１まとめにして記述 （１）
(3)視野参照座標系:どの位置から見るか
(0,0,1)
(4)クリッピング：どの部分を切り取るか
(5)ビューポート変換：表示装置
のWindowのどこに表示させるか
(5,10,20)
(1,0,0)
（２）
（３）
投影面２
（４）
投影面１
前方クリップ面
（４）
（３）
767
（５）
デバイス座標系
視野座標系投影面
0
1023
Ⅱ-14
投影法の設定とビューボリューム：この範囲しか表示されない
平行投影のビューボリューム
y top= y2
x left =x1
視点の
方向
x right= x2
z near = z1
y bottom =y1
z far= z2
このあたりに図形を書い
ても表示されない
glOrtho( xleft ,xright ,ybottom ,ytop ,znear ,zfar);
Ⅱ-15
透視投影のビューボリューム
w
aspect =
h
w
視点
（投影中心）
h
fovy
z near
z far
gluPerspective(fovy,aspect,znear,zfar);
fovy：ビューボリューム（四角錐台）の上下の開き角
aspect：断面の幅／高さの比
znear,zfar：視点から頂面までと底面までの距離（座標値ではない）
Ⅱ-16
透視投影によるポリゴン描画p24：
実行！
１）c2-1.cをコピーして実行する(pdf)．
実行結果
実行！
２）gluPerspective(60.0,aspect,1.0,7.0);を
glOrtho(0.0,5.0,0.0,5.0,1.0,7.0);に変更して実行
３） glOrtho(0.0,5.0,0.0,5.0,0.0,7.0);で実行
４） glOrtho(-5.0,5.0,-5.0,5.0,0.0,7.0);
Ⅱ-17
2.3 幾何変換
ワールド座標空間＝物体を置く空間＝で物体の位置や姿勢を
変えたり寸法を拡大・縮小する操作
平行移動： glTranslatef(tx,ty,tz)
回転： glRotatef(angle,tx,ty,tz)((tx,ty,tz)軸周りにangle度回転）
拡大・縮小： glScalef(tx,ty,tz)
普通の考え方では
物体を作ってからそれを回転させる，あるいは回転した絵を最
初から書く
(この人は特別としてhttp://karapaia.livedoor.biz/archives/52117877.html)
が、
OpenGLでは座標系を回転させてから書く（書き手が回転して
書くイメージ）。
Ⅱ-18
練習問題2－1（p27 2.3.2)：
（１）C2-1.cにおいて，以下の幾何変換を実行せよ．
・ｘ方向へ０．２，ｙ方向へ０．１，ｚ方向へ０．２平行移動
・ｙ軸方向に３０度回転
・ｚ方向に２倍，ｙ方向に０．５倍拡大
（２）前回使用したc2-1.cにおいて，図形をｙ軸周りに３０度回転させ，c2-1.cと比較
（３）c2-1.cにおいてビューボリュームの形を変えて(glPerspectiveの引数を変える）
結果を確認せよ．
ファイル名はp2-1-1a.c, p2-1-1b.c, p2-1-1c.c, p2-1-2.c, p2-1-3.cとする
解答例 １a 1b 1c ２ ３