第7章 レンダリング

第 7 章 レンダリング
第 7 章 レンダリング
畔上 秀幸
名古屋大学 情報科学研究科 複雑系科学専攻
December 15, 2016
1 / 59
第 7 章 レンダリング
はじめに
§7.1 はじめに
(目標) CG で使われる 3 次元形状を写実的に表示するための技術 (レンダリン
グ) について理解する．
2 / 59
第 7 章 レンダリング
レンダリングとは
§7.2 レンダリングとは
定義 7.2.1 (レンダリングとは)
3 次元形状を写実的に表示するための方法を総称してレンダリング (rendering)
という．
レンダリングには，次のような種類がある．
1 隠線/隠面処理 (hidden line/surface calculation)
a 外向き法線法 (outer normal algorithm)
b Z バッファ法 (Z-buffer algorithm)
c スキャンライン法 (scan-line algorithm)
2
シェーディング (shading)
a フラットシェーディング (flat shading) あるいはコンスタントシェーディング
(constant shading)
b スムーズシェーディング (smooth shading)
i グーロー (Gourand) シェーディング
ii フォン (Phong) シェーディング
3 / 59
第 7 章 レンダリング
レンダリングとは
3
テクスチャマッピング (texture mapping)
a 表面テクスチャマッピング (surface texture mapping)
b バンプマッピング (bump mapping)
c 環境マッピング (environmental mapping)
i 反射マッピング (reflection mapping)
ii 屈折マッピング (refraction mapping)
d ソリッドテクスチャマッピング (solid texture mapping)
4
レイトレーシング (ray tracing)
5
ボリュームビジュアライゼーション (volume visualization)
a ボリュームレンダリング (volume rendering)
b サーフェイスレンダリング (surface rendering)
4 / 59
第 7 章 レンダリング
隠線/隠面処理
§7.3 隠線/隠面処理
定義 7.3.1 (隠線/隠面処理とは)
多面体を対象にして，投影変換の結果，見えない線あるいは面を消去する処理
を隠線/隠面処理という．
多面体
隠線処理後
隠面処理後
図 7.1: 隠線/隠面処理
5 / 59
第 7 章 レンダリング
隠線/隠面処理
外向き法線法
§7.3.1 外向き法線法
定義 7.3.2 (外向き法線法)
多面体の面ごとに外向き法線 ν ∈ R3 と視線の方向 e ∈ R3 を計算して，内積
ν · e ≥ 0 のとき可視，ν · e < 0 のとき不可視と判定する方法を外向き法線法と
いう．
面の法線 ν は，面の頂点を右回りに p0 , p1 , p2 としたとき，
ν=
(p1 − p0 ) × (p2 − p0 )
∥(p1 − p0 ) × (p2 − p0 )∥
で計算される．
(問題点)
凸多面体でない場合には，判定を誤る．
6 / 59
第 7 章 レンダリング
隠線/隠面処理
外向き法線法
º
p1
e
e
e
p2
º
p0
外向き法線法
º
凸多面体でない場合
図 7.2: 外向き法線法
7 / 59
第 7 章 レンダリング
隠線/隠面処理
Z バッファ法
§7.3.2 Z バッファ法
定義 7.3.3 (Z バッファ法)
ピクセルごとに多面体の奥行き値を正規化視座標系で表した値を z 値という． z
値を記憶するメモリを Z バッファという． Z バッファを用いた隠線/隠面判定法
を Z バッファ法という．
8 / 59
第 7 章 レンダリング
隠線/隠面処理
Z バッファ法
(手順)
1
2
3
メモリの確保：ピクセルごとに，色を記憶するフレームバッファ f (x, y) と
Z バッファ b(x, y) を用意する．
初期化： すべてのピクセル (x, y) に対して，f (x, y) に背景色を，b(x, y) に
背景の距離を入力する．
Z バッファの書換： すべての面に対して，面を投影変換した多角形領域内
にあるピクセル (x, y) の z 値 z(x, y) を求め，
If z (x, y) < b (x, y) , then b (x, y) := z (x, y) and f (x, y) := 面の色
により，b(x, y) と f (x, y) をかきかえる．
Z バッファ法の特徴
1
高速処理が可能である．
2
反射，屈折の処理が難しい．
9 / 59
第 7 章 レンダリング
隠線/隠面処理
スキャンライン法
§7.3.3 スキャンライン法
定義 7.3.4 (スキャンライン法)
画面上の走査線をスキャンラインという．スキャンライン単位で隠面処理を行う
方法をスキャンライン法という．
x
e
º
y
図 7.3: スキャンライン法
10 / 59
第 7 章 レンダリング
隠線/隠面処理
スキャンライン法
(手順)
1
2
y ソート: 視線方向を向いたすべての面を正規化視座標系に変換し，各面ご
とに最大/最小の y 値，各辺ごとに最大/最小の y 値を求め，最小 y 値の昇
順でソートする．
スキャンラインごとに次のこと行う．
a x ソート: スキャンライン平面とすべての平面の交差を調べ，交差するすべての
辺の最大/最小の x 値を求め，最小 x 値の昇順でソートしたリスト (アクティブ
セグメントリスト) を作成する．
b z ソート: アクティブセグメントリストの辺データを z 値の昇順でソートし， z
値が最小の面の色をフレームバッファに格納する．
スキャンライン法の特徴
1
メモリの節約が可能である．
2
透過処理が可能である．
3
Z バッファ法よりも高速処理は難しい．
11 / 59
第 7 章 レンダリング
OpenGL における隠面処理
§7.4 OpenGL における隠面処理
OpenGL において隠面処理を行うためには次の関数をよびだす．
• Z バッファ利用の宣言
• void glutInitDisplayMode(GLUT DEPTH)
• Z バッファの初期化 (背景の距離を入力)
• void glClear(GL COLOR BUFFER BIT | GL DEPTH BUFFER BIT)
• 有効範囲の指定
• glEnable(GL DEPTH TEST) ∼ glDisable(GL DEPTH TEST)
12 / 59
第 7 章 レンダリング
OpenGL における隠面処理
ドーナツを切る．
図 7.4: ドーナツを切る
13 / 59
第 7 章 レンダリング
OpenGL における隠面処理
program7 1.c
...
glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB | GLUT_DEPTH);
...
/* DEPTH バッファを ON */
#if 0
glEnable(GL_DEPTH_TEST);
#endif
...
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
...
glutSolidTorus(0.5, 0.9, 50, 50);/* トーラスを描画 */
...
glRectf(-2.0, -2.0, 2.0, 2.0);/* 長方形を描画 */
...
14 / 59
第 7 章 レンダリング
シェーディング
§7.5 シェーディング
定義 7.5.1 (シェーディングとは)
多面体表面から視点に到達する光の輝度を計算する方法をシェーディング
(shading) という．
1
RGB それぞれに対して，光の輝度を計算する．
a
b
c
d
2
拡散反射 (diffuse reflection): Lambert 反射 (Lambertian reflectance)
鏡面反射 (specular reflection): Phong 反射モデル (Phong reflection model)
環境光反射 (ambient reflection)
透過光 (transmitted light)
多面体表面に対して光の輝度の分布を計算する．
a フラットシェーディング (flat shading)
b Gouraud シェーディング (Gouraud shading)
c Phong シェーディング (Phong shading)
15 / 59
第 7 章 レンダリング
シェーディング
輝度の計算
§7.5.1 輝度の計算
l
º
図 7.5: 拡散反射
16 / 59
第 7 章 レンダリング
シェーディング
輝度の計算
1
ν ∈ R3 を表面の外向き単位法線，l ∈ R3 を光源の向きを示す単位ベクト
ル，kd ∈ [0, 1], を拡散反射率とする．l · ν ≥ 0 が成り立つ表面において，
RGB それぞれの入射光の輝度 iin に対して，表面の外向きすべての方向
に一様な輝度
id = kd iin l · ν
の光が反射されると仮定するとき，拡散反射 (Lambert 反射) という．拡散
反射は，つや消し塗料仕上げの表面を表現するために使われる．
2
ν, l ∈ R3 を前項と同様とする．r ∈ R3 を ν に対して l ∈ R3 の鏡面反射の
向きを示す単位ベクトル，e ∈ R3 を視点の向きを示す単位ベクトル，ks ,
0 ≤ ks ≤ 1, を鏡面反射率，n > 0 を反射の鋭さを示す定数とする．l · ν ≥ 0
が成り立つ表面において，RGB それぞれの入射光の輝度 iin に対して，輝度
n
is (α) = ks iin (r · e)
の光が反射されると仮定するとき，鏡面反射 (Phong 反射モデル) という．
ただし，cos α = r · e ≥ 0 とする．ガラスや金，銀などの反射特性は，ks を
cos θ = l · ν ≥ 0 の関数で表現される．
17 / 59
第 7 章 レンダリング
シェーディング
輝度の計算
º
l
r
e
図 7.6: 鏡面反射
18 / 59
第 7 章 レンダリング
シェーディング
輝度の計算
3
ka , 0 ≤ ka ≤ 1, を環境光反射率とする．入射光とは無関係に，すべての表
面に届く光の輝度 iamb に対して，輝度
ia = ka iamb
の光を反射すると仮定するとき，環境光反射 という．
屋外シーンでは id , is の 10 % ∼ 20 % を ia とする．
4
d, 0 ≤ d ≤ 1, を透過率とする．物体後方からくる光の輝度 i0 に対して，屈
折方向に，輝度
it = di0
の光が届くと仮定するとき，透過光 という．
19 / 59
第 7 章 レンダリング
シェーディング
輝度分布の計算
§7.5.2 輝度分布の計算
1
多面体モデルをそのままシェーディングする方法を，フラットシェーディン
グあるいはコンスタントシェーディングという．
フラット
Gouraud
Phong
図 7.7: シェーディングの違いによる球の表示
20 / 59
第 7 章 レンダリング
シェーディング
輝度分布の計算
2
次のようなスムースシェーディング法を Gouraud シェーディングあるい
は輝度補間法という．ただし，多面体の表面多角形を 3 角形として，E を表
面多角形の集合，N を頂点の集合とする．
a 頂点 j ∈ N に対して，Ej ⊂ E を j を含む表面多角形の集合とする．すべての
i ∈ Ej に対して法線を νi とかく．このとき，
∑
i∈Ej νi
νj =
|Ej |
を頂点 j の平均法線とする．
ºi3
ºj
ºi4
ºi2
ºi1
図 7.8: 平均法線
21 / 59
第 7 章 レンダリング
シェーディング
輝度分布の計算
b νj を用いて各頂点の輝度 ij , j ∈ N , を計算する．
3
c 表面多角形 Ωi , i ∈ E, の頂点を
(
) x(α)i ∈ R , α ∈ Ni , 輝度 i(α)i , さらに，
ϕ(α)i : Ωi → R を ϕ(α)i x(β)i = δαβ , α, β ∈ Ni , を満たす関数とする．このと
き，x ∈ Ωi に対して，輝度を
∑
ih (x) =
ϕ(α)i (x) i(α)i
α∈Ni
で補間する．ϕ(α)i は基底関数とよばれる．
i(3)i
i(2)i
ih
i(1)i
x(3)i
Á(3)i
Á(2)i
Á(1)i
1
i
x(2)i
x(1)i
図 7.9: Gouraud シェーディング
22 / 59
第 7 章 レンダリング
シェーディング
輝度分布の計算
3
次のようなスムースシェーディング法を Phong シェーディングあるいは法
線補間法という．
a 頂点 j ∈ N に対して，Ej ⊂ E を j を含む表面多角形の集合，νi を i ∈ Ej の法
線とするとき，
∑
i∈Ej νi
νj =
|Ej |
を j の平均法線とする．
3
b 表面多角形 Ωi , i ∈ E, の頂点を
(
) x(α)i ∈ R , α ∈ Ni , 法線を ν(α)i , さらに，
ϕ(α)i : Ωi → R を ϕ(α)i x(β)i = δαβ , α, β ∈ Ni , を満たす関数とする．このと
き，x ∈ Ωi に対して，法線を
∑
νh (x) =
ϕ(α)i (x) ν(α)i
α∈Ni
で補間する．
c νh (x) から，輝度 i (x) を計算する．
23 / 59
第 7 章 レンダリング
シェーディング
輝度分布の計算
º(3)i
ºh
º(2)i
º(1)i
Á(3)i
x(3)i
Á(2)i
Á(1)i
1
i
x(2)i
x(1)i
図 7.10: Phong シェーディング
24 / 59
第 7 章 レンダリング
OpenGL による表面の設定
§7.6 OpenGL による表面の設定
glLightfv()
void glLightfv(GLenum light, GLenum pname, const GLfloat *params)
• light には光源の番号 (GL LIGHT0 ∼ GL LIGHT7) を指定する．
• param にはパラメータの値を指定する．
•
•
•
•
•
•
•
•
•
•
GL
GL
GL
GL
GL
GL
GL
GL
GL
GL
AMBIENT : 光の環境 RGBA 輝度
DIFFUSE : 光の拡散 RGBA 輝度
SPECULAR : 光の鏡面 RGBA 輝度
POSITION : 光の位置 (x, y, z, w)
SPOT DIRECTION : スポットライトの向き (x, y, z)
EXPONENT : スポットライトの円錐方向の減衰率
SPOT CUTOFF : スポットライトの広がり角 (度)
CONSTANT ATTENUATION : 一定減衰率 kc
LINEAR ATTENUATION : 線形減衰率 kl
QUADRATIC ATTENUATION : 2 次減衰率 kq
25 / 59
第 7 章 レンダリング
OpenGL による表面の設定
d を光の位置と頂点の間の距離とするとき，減衰係数は
1
kc + kl d + kq d2
で計算される．
glMaterialfv()
void glMaterialfv(GLenum face, GLenum pname,
const GLfloat *params);
• 表面の光の反射特性を設定する．
• face には次を指定する．
• GL FRONT: 表面
• GL BACK : 裏面
• GL FRONT AND BACK :両面
26 / 59
第 7 章 レンダリング
OpenGL による表面の設定
• pname には次を指定する．
• GL AMBIENT (RGBA) : 環境光に対する反射係数，光の当たらない部分の明
るさ
• GL DIFFUSE (RGBA ) : 拡散反射係数，表面の色に相当
• GL SPECULAR (RGBA ) : 鏡面反射係数，光源の映り込みの強さ
• GL EMISSION (RGBA ) : 発光係数
• GL SHININESS (0 ∼ 128) :ハイライトの輝き，大きいほどハイライト部分が小
• GL AMBIENT AND DIFFUSE (RGBA, RGBA): 拡散反射係数と鏡面反射係数
の両方
• GL SPECULAR を (1 1 1 1) ， GL SHININESS を大きくすればつややかになる．
• GL SPECULAR を GL DIFFUSE と同じにして GL AMBIENT を 0 に近づければ
金属的になる．
27 / 59
第 7 章 レンダリング
OpenGL による表面の設定
球のライティング
program7 2.c
void display(void)
...
/*照明*/
glLightfv(GL_LIGHT0, GL_AMBIENT, light0_ambient); /* 環境光 */
glLightfv(GL_LIGHT0, GL_DIFFUSE, light0_diffuse); /* 拡散光 */
glLightfv(GL_LIGHT0, GL_SPECULAR, light0_specular); /* 鏡面光 */
/*材質の鏡面反射色*/
glMaterialfv(GL_FRONT, GL_SPECULAR, material_specular);
glMaterialfv(GL_FRONT, GL_SHININESS, shininess); /*ハイライト*/
...
28 / 59
第 7 章 レンダリング
OpenGL による表面の設定
演習 7.6.1 (球のライティング)
program7 2.c を実行し，次の原因を考察せよ．
1
球の影が床にないのはなぜか？
2
スポットライトの当る球や床の領域が矩形になっているのはなぜか？
より美しくみえるように設定値を変えてみよ．
29 / 59
第 7 章 レンダリング
テクスチャマッピング
§7.7 テクスチャマッピング
3 次元オブジェクトの表面に，表面の形状に沿って模様 (texture) を貼り付け
る処理をテクスチャマッピングという．
1
表面テクスチャマッピング
2
バンプマッピング
3
環境マッピング
4
ソリッドテクスチャ
30 / 59
第 7 章 レンダリング
テクスチャマッピング
1
2 次元の画像データを 3 次元オブジェクトの表面に貼り付ける処理を表面テ
クスチャマッピングという．
a
b
c
d
平面投影マッピング
円筒面投影マッピング
球面投影マッピング
曲面パラメータ化テクスチャマッピング
図 7.11: 表面テクスチャマッピング
31 / 59
第 7 章 レンダリング
テクスチャマッピング
2
オブジェクト表面の細かな凸凹を法線方向の変化のみで輝度の変化を計算す
る方法をバンプマッピング (bump mapping) という．
図 7.12: バンプマッピング
3
オブジェクトの周囲に背景や前景をマッピングした面を設けて，視点から到
達した色を表示する方法を環境マッピング (environment mapping) と呼ぶ．
a 反射マッピング (reflection mapping)：オブジェクト表面で反射を 1 回行う．
b 屈折マッピング (refraction mapping)：オブジェクト表面で屈折を 1 回行う．
32 / 59
第 7 章 レンダリング
テクスチャマッピング
反射マッピング
屈折マッピング
図 7.13: 環境マッピング
4
3 次元空間のテクスチャを数式やアルゴリズムで作成し，オブジェクトの表
面から内部に連続しているテクスチャを表現する方法をソリッドテクスチャ
(solid texture) という．木材や岩石などの表現で使われている．
33 / 59
第 7 章 レンダリング
テクスチャマッピング
図 7.14: ソリッドテクスチャ
34 / 59
第 7 章 レンダリング
OpenGL によるテクスチャマッピング
§7.8 OpenGL によるテクスチャマッピング
glPixelStorei()
void glPixelStorei(GLenum pname, GLint param);
• ピクセル（画素）の格納モードを設定する．
• pname に GL UNPACK ALIGNMENT を指定した場合，param には 1, 2, 4,
8 のいずれかを指定する．
• 1 画素が RGBA，各色 1 バイトのとき 4 を指定する．
• 1 画素が RGB，各色 1 バイトのとき 1 を指定する（3 は指定できない）．
35 / 59
第 7 章 レンダリング
OpenGL によるテクスチャマッピング
glTexParameteri()
void glTexParameteri(GLenum target, GLenum pname,
GLint param);
• テクスチャのパラメータを設定する．
• target に GL TEXTURE 2D を指定（1 次元の場合は別の設定）
• pname に GL TEXTURE MAG FILTER を指定した場合，param にテクス
チャが拡大されるときの補間方法を指定
• GL NEAREST（最近傍法）
• GL LINEAR（双線形補間）
36 / 59
第 7 章 レンダリング
OpenGL によるテクスチャマッピング
• pname に GL TEXTURE MIN FILTER を指定した場合，param にテクス
チャが縮小されるときの補間方法を指定する．
•
•
•
•
•
•
GL
GL
GL
GL
GL
GL
NEAREST
LINEAR
NEAREST MIPMAP NEAREST
NEAREST MIPMAP LINEAR
LINEAR MIPMAP NEAREST
LINEAR MIPMAP LINEAR
ただし，MIPMAP は画像の縮小サンプリングを行う際のエリアシングの発
生を抑える手法である．
• pname に GL TEXTURE WRAP S あるいは GL TEXTURE WRAP T を指
定した場合，param に s 軸あるいは t 軸の繰り返し指定を行う．
• GL REPEAT（繰り返し）
• GL CLAMP(クランプ)
37 / 59
第 7 章 レンダリング
OpenGL によるテクスチャマッピング
glTexImage2D()
void glTexImage2D(GLenum target, GLint level,
GLint internalFormat, GLsizei width, GLsizei height,
GLint border, GLenum format, GLenum type,
const GLvoid *pixels);
• ２次元テクスチャ画像を指定する．
• Target に GL TEXTURE 2D を指定する．
• Level に MIPMAP を行う場合のテクスチャの解像度レベルを指定する．た
だし，MIPMAP を行わない場合は 0 とする．
• internalFormat にテクスチャのデータ形式を指定する．GL RGB, GL RGBA,
GL ALPHA, GL LUMINANCE, GL LUMINANCE ALPHA, GL INTENSITY
など 全 38 種類
38 / 59
第 7 章 レンダリング
OpenGL によるテクスチャマッピング
• width, height にテクスチャの幅と高さを指定する．
• border に境界線の太さを指定する．テクスチャ境界なしのとき 0 を指定
する．
• format は引数 pixels に指定したメモリ上の画像の形式を指定する．
GL RGB, GL RGBA, GL COLOR INDEX, GL RED, GL GREEN, GL BLUE,
GL ALPHA, GL LUMINANCE, GL LUMINANCE ALPHA が指定可能
• type に pixels のデータ型を指定する．GL UNSIGNED BYTE （unsigned
char と等価）, GL BYTE, GL SHORT, GL UNSIGNED SHORT, GL INT,
GL UNSIGNED INT, GL FLOAT, GL BITMAP が指定可能
• pixels に テクスチャ画像を格納した配列のポインタを指定する．
39 / 59
第 7 章 レンダリング
OpenGL によるテクスチャマッピング
glTexEnvi()
void glTexEnvi(GLenum target, GLenum pname, GLint param);
• target に GL TEXTURE ENV を指定する．
• pname に GL TEXTURE ENV MODE を指定する．
• param には次を指定する．
• GL MODULATE (テクスチャとベースの掛け算)
• GL DECAL (ステッカを貼るイメージ)
• GL BLEND (あらかじめ定義しておいた色との混合)
• GL REPLACE (置き換え)
40 / 59
第 7 章 レンダリング
OpenGL によるテクスチャマッピング
ティーポットにテクスチャを貼り付ける．
program7 3.c
int main(int argc, char **argv)
...
/* テクスチャーの初期化 */
make_image();
init_texture();
...
void display(void)
...
glEnable(GL_TEXTURE_2D);
...
glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE,
GL_MODULATE);
...
41 / 59
第 7 章 レンダリング
OpenGL によるテクスチャマッピング
図 7.15: ティーポットにテクスチャを貼り付ける
42 / 59
第 7 章 レンダリング
レイトレーシング
§7.9 レイトレーシング
目に到達するまでの光を逆に辿ることによって色を計算する方法をレイトレー
シング (ray tracing) という．
図 7.16: レイトレーシング
43 / 59
第 7 章 レンダリング
レイトレーシング
レイトレーシングのアルゴリズム
1
空間中に視点とスクリーンを定義する．
2
各画素について，次の計算を行う．
a 画素点と視点を直線 (レイ) を作成する．
b レイとすべてのオブジェクトとの交点を求める．
(1) 交点がなければ，その画素の輝度は背景色とする．
(2) 交点があれば，視点に一番近い交点を可視点とし，可視点の輝度を計算し，その画素の
輝度とする．
44 / 59
第 7 章 レンダリング
レイトレーシング
可視点輝度の計算
1
x0 ∈ R3 を可視点とする．L を光源の集合，idi (x0 ), isi (x0 ) を i ∈ L から
の光が直接 x0 で拡散反射，鏡面反射の輝度とする．このとき， x0 の輝
度は
∑
i (x0 ) =
(idi (x0 ) + isi (x0 ))
i∈L
+ kr (x0 ) ir (xr ) + kt (x0 ) it (xt )
と仮定する．ただし，xr はレイが可視点で完全鏡面反射したときの次の交
点，xt をレイが可視点で屈折したときの次の交点とする．kr , kt は反射係
数と透過係数である．
45 / 59
第 7 章 レンダリング
レイトレーシング
2
さらに，xr と xt の輝度を
∑
ir (xr ) =
(idi (xr ) + isi (xr ))
i∈L
+ kr (xr ) ir (xrr ) + kt (xr ) it (xrt )
∑
it (xt ) =
(idi (xt ) + isi (xt ))
i∈L
+ kr (xt ) ir (xtr ) + kt (xt ) it (xtt )
と仮定する．ただし，xrr , · · · , xtt はレイが完全鏡面反射あるいは屈折した
ときの次の交点とする．
3
4
以下，同様に反射あるいは屈折がなくなるか，あるいは上限回になるまで輝
度の式を仮定する．
最後の式から，可視点側に向かって代入計算を行い，i (x0 ) を求める．
46 / 59
第 7 章 レンダリング
ボリュームビジュアライゼーション
§7.10 ボリュームビジュアライゼーション
これまでのレンダリングは 3 次元形状が与えられていることを前提にしてい
た．ここでは，3 次元領域の中にある属性値 (X 線 CT の場合は X 線吸収量) が
埋め込まれている (場所の関数として与えられている) 次のような状況を考えて
みよう．
1
2
3
3 次元矩形領域 Ω ⊂ R3 は微小立方体 Ωi , i ∈ E, の周期的に配置された集合
であるとみなす．Ωi をボクセル (voxel) とよぶ．
X 線 CT によって得られる X 線吸収量，密度，濃度，熱，圧力などのスカ
ラー値関数 v : Ω → R を属性値とみなす．
属性値がボクセルごとに与えられているとき，すなわち vi : E ∋ i → v ∈ R
のとき，V = {vi }i∈E をボクセルデータ (voxel data) あるいはボリューム
データ (volume data) という．ボクセルデータをボクセルの中心に配置し，
それらを頂点にした配置をここでは格子という．
47 / 59
第 7 章 レンダリング
ボリュームビジュアライゼーション
vi
vi
i
(a) ボクセル Ωi
(b) ボクセル中心を頂点とする格子
図 7.17: ボクセル Ωi と属性値 vi
48 / 59
第 7 章 レンダリング
ボリュームビジュアライゼーション
定義 7.10.1 (ボリュームビジュアライゼーション)
ボクセルデータから，属性値の違う領域を可視化する方法をボリュームビジュア
ライゼーション (volume visualization) という．
ボリュームビジュアライゼーションには，次のような種類がある．
1
ボリュームレンダリング (volume rendering)
2
サーフェイスレンダリング (surface rendering)
(a) ボリュームレンダリングの例
(b) サーフェイスレンダリングの例
図 7.18: ボリュームビジュアライゼーション
49 / 59
第 7 章 レンダリング
ボリュームビジュアライゼーション
ボリュームレンダリング
§7.10.1 ボリュームレンダリング
定義 7.10.2 (ボリュームレンダリング)
r
g
b
attribute value v
(a) 色関数
Intensity of light
Intensity of light
視点からの光線 (レイ) が 3 次元領域を通過する際の減衰を考慮して光を追跡す
る方法をボリュームレンダリング (volume rendering) とよぶ．
®
attribute value v
(b) 不透明度関数
図 7.19: ボリュームレンダリングで使われる色と不透明度を決める関数
50 / 59
第 7 章 レンダリング
ボリュームビジュアライゼーション
ボリュームレンダリング
ボリュームレンダリングのアルゴリズム：
1
2
属性値 v ∈ R に対して色 c = (r (v) , g (v) , b (v)) と不透明度 α (v) を対応さ
せる関数 (c, α) : R → R4 を指定する (図 7.19)．
レイの方向に輝度を計算していく．そのためにレイの方向にサンプリング点
xj , j ∈ S, を設け，xj が含まれるボクセル Ωi の格子点 x(α) ∈ R3 ,
α ∈ {1, · · · , 8} の属性値 v(α) からサンプリング点の属性値を
vj = vh (xj ) =
∑
ϕ(α) (xj ) v(α)
α∈{1,··· ,8}
(
)
で補間する．ただし，ϕ(α) : Ωi → R を ϕ(α) x(β) = δαβ ,
α, β ∈ {1, · · · , 8}, を満たす関数 (x1 , x2 , x3 に関する 3 重 1 次多項式) とす
る．ϕ(α) は基底関数とよばれる．
51 / 59
第 7 章 レンダリング
ボリュームビジュアライゼーション
ボリュームレンダリング
xi
xi+1
xi+2
¢s
s
図 7.20: ボリュームレンダリングで使われるサンプリング点
3
サンプリング点
xj , j ∈ S, の不透明度 αj = α (vj ) をレイの方向に足して
∑
いき， j={1,··· ,m} αj = 1 となるか，あるいはボクセルがなくなったとき
のサンプリング点の数を m，cm をサンプリング点 xm の色，あるいは背
景色として，
im := cm
for i = m − 1 to 0 do ii := αi ci + (1 − αi ) ci+1
52 / 59
第 7 章 レンダリング
ボリュームビジュアライゼーション
ボリュームレンダリング
i := i0
によってレイに対する 3 原色の輝度 i = (iR , iG , iB ) を計算する．
53 / 59
第 7 章 レンダリング
ボリュームビジュアライゼーション
ボリュームレンダリング
さらに，属性値の勾配を利用して，境界を強調することやシェーディングの機
能を加えることもできる．
格子点の座標を xijk = (xi1 , xj2 , xk3 ), i, j, k ∈ {1, · · · , m}, とかくとき，属性
値 v の xijk における勾配は，中心差分の定義を用いれば


v (xi+1 1 , xj2 , xk3 ) − v (xi−1 1 , xj2 , xk3 )
1
∇v (xijk ) = v (xi1 , xj+1 2 , xk3 ) − v (xi1 , xj−1 2 , xk3 )
2
v (xi1 , xj2 , xk+1 3 ) − v (xi1 , xj2 , xk−1 3 )
によって計算される．
1
2
格子点 xijk の不透明度 αijk を ∇v (xijk ) の大きさ ∥∇v (xijk )∥ の関数と
して定義すれば，境界を強調した表示が得られる．
∇v (xijk ) が 3 次元ベクトルであることに注意して，Phong シェーディング
を適用できる．
54 / 59
第 7 章 レンダリング
ボリュームビジュアライゼーション
ボリュームレンダリング
図 7.21: 属性値の勾配を利用したシェーディング
55 / 59
第 7 章 レンダリング
ボリュームビジュアライゼーション
サーフェイスレンダリング
§7.10.2 サーフェイスレンダリング
定義 7.10.3 (サーフェイスレンダリング)
ボクセルデータから等値面を求め，その等値面に使ってレンダリングを行う方法
をサーフェイスレンダリング (surface rendering) とよぶ．その中で，格子内部の
等値面を基本パターンへの場合分けに基づいて求める方法をマーチングキューブ
法 (marching cubes method) とよぶ．
等値面の属性値 (閾値) を v0 とする．格子点 x(α) ∈ R3 , α ∈ {1, · · · , 8} の属
性値 v(α) が v(α) ≤ v0 のときに 0，v(α) > v0 のときに 1 を x(α) に割り当てる．
このとき，8 つの格子点に割り当てられた 0, 1 の組み合わせの場合の数は
28 = 256 通りとなる．ここで，対称性を考慮すれば，位相が同じパターンは図
7.22 (b) のような 15 種類となる．
そこで，格子ごとにパターンを特定し，その上で必要となる未知数を求めてい
くことによって，全体の等値面を構成することができる．
56 / 59
第 7 章 レンダリング
ボリュームビジュアライゼーション
サーフェイスレンダリング
1
1
1
1
0
0
0
0
(a) 一例
(b) すべてのパターン
図 7.22: マーチングキューブ法で使われる格子点の {0, 1} パターン
57 / 59
第 7 章 レンダリング
まとめ
§7.11 まとめ
CG で使われる 3 次元形状を写実的に表示するための技術をレンダリングと
いう．
1
2
辺/面の可視/不可視の判定法を隠線/隠面処理という．隠線/隠面処理には，
Z バッファ法とスキャンライン法がある．
光による陰影を付ける方法をシェーディングという．シェーディングには，
フラットシェーディング法とスムーズシェーディング法がある．
3
表面に画像を張り付ける方法をテクスチャマッピングという．
4
光を追跡して高品位の画像を作成する方法をレイトレーシングという．
5
3 次元空間に分布するデータを透視画像に変換する方法をボリュームレンダ
リングという．
58 / 59
第 7 章 レンダリング
参考文献
参考文献
[1] James D. Foley, Steven K. Feiner, Andries van Dam, John F. Hughes, 佐藤義雄 (訳).
コンピュータグラフィックス 理論と実践.
オーム社, 2001.
[2] 千葉則茂, 土井章男.
３次元 CG の基礎と応用.
サイエンス社, 2004.
[3] 林武文, 加藤清敬.
OpenGL による 3 次元 CG プログラミング.
コロナ社, 2003.
59 / 59