コンピュータグラフィックスS 第6回 第6回 レンダリング・パイプライン システム創成情報工学科 尾下 真樹

Slides:



Advertisements
Similar presentations
シミュレーション演習 G. 総合演習 ( Mathematica 演 習) システム創成情報工学科 テキスト作成: 藤尾 光彦 講義担当: 尾下 真樹.
Advertisements

池内研究室 Computer Vision Laboratory 東京大学 The University of Tokyo 偏光レイトレーシング 宮崎大輔 2004 年 6 月 22 日(火) CVL セミナー.
Powerpoint 機能の使い方. 1.簡単な図の作成 例として植物個体の図を作成 (1)輪郭を大まかに描く まず、「オートシェイプ」 → 「線」 → 「曲 線」を選び、輪郭を適当に描く.
ファーストイヤー・セミナーⅡ 第13回 2次元グラフィックス(1). 2次元グラフィックス Ultra-C では、これまで利用してきた「標準入出力」 以外に「グラフィックス画面」があり、図形などを 表示できる C 言語のグラフィックスには細かな規定がなく、こ れから学ぶ内容が他の環境、システムでは利用でき.
上手なプレゼンのための ワンポイント・アドバイス
今回の内容 シェーディング マッピング 光の効果の表現 表面の素材の表現 オブジェクトの形状表現 光の効果の表現 表面の素材の表現
豊洲 304教室 15 JULY コンピュータグラフィックス 2008年度版.
情報処理演習 (9)グラフィックス システム科学領域 日浦 慎作.
今回の内容 前回の復習 演習環境 サンプルプログラムの解説 プログラミング演習 OpenGLとGLUTの概要 サンプルプログラムの概要
プログラミング演習3 李 亜民クラス 第2回 ラスタライズ.
高度情報演習1A “テーマC” 実践 画像処理プログラミング 〜画像認識とCGによる画像生成〜 第四回 演習課題 画像中からの物体抽出処理(背景情報を手がかりとして) 芝浦工業大学 工学部 情報工学科 青木 義満 2006/05/15.
パノラマ動画像モデルによる 仮想空間表現システムの研究
影付け,映り込み,光の屈折・反射などが表現でき,リアルな画像を生成できるレイトレーシング法について説明する.
CGアニメーションの原理 基本技術 対象物体の動きや変形の設定方法 レンダリング技術
今日の内容 レンダリングの種類 レンダリングの予備知識 レンダリング手法 レンダリングの高速化の工夫 サンプリング
Microsoft PowerPoint98 Netscape Communicator 4.06[ja]
情報処理 第7回.
11章 ボリュームレンダリングを学ぶ 本来は目に見えない内部情報をレンダリングし可視化する技術
本講義の目標: ・C言語とOpenGLを用いて,プログラミングによるコンピュータグラフィックス生成手法について学ぶ
3DCG技法についての 調査報告 ○○県立○○高等学校 1年は組 グループ0.
今日の内容 前回の演習の復習 前回の復習 ポリゴンの描画方法(復習) 基本オブジェクトの描画 ポリゴンモデルの描画 演習課題.
今日の内容 前回の復習 前回の演習の復習 視点操作の実現方法(復習) 視点操作の拡張 変換行列によるアニメーション 演習課題.
平成23年8月 情報学群 岡田 守 このスライドは, 前川佳徳編著による「コンピュータグラフィックス」(オーム社)を基に作成されている.
地理情報システム論 第3回 コンピュータシステムおける データ表現(1)
CADの概要2 電子制御設計製図Ⅰ 2009年4月14日 Ⅲ限目.
レンダリングにおいて写実性を高めるための処理である,シェーディングとテクスチャマッピングについて述べる.
隠面処理 日本語:隠面処理(陰面消去) 英語:hidden-surface removal 可視な部分だけ表示,
今日の内容 前回の復習 モデリング 3次元オブジェクトの表現方法 3次元オブジェクトの作成方法 オブジェクトを計算機上でどのように表現するか
透視投影(中心射影)とは  ○ 3次元空間上の点を2次元平面へ投影する方法の一つ  ○ 投影方法   1.投影中心を定義する   2.投影平面を定義する
高山建志 五十嵐健夫 テクスチャ合成の新たな応用と展開 k 情報処理 vol.53 No.6 June 2012 pp
階層的境界ボリュームを用いた 陰関数曲面の高速なレイトレーシング法
高度情報演習1A “テーマC” 実践 画像処理プログラミング 〜画像認識とCGによる画像生成〜 第三回 演習課題 画像中からの物体抽出処理(色情報を手がかりとして) 芝浦工業大学 工学部 情報工学科 青木 義満 2006/05/08.
精密工学科プログラミング基礎Ⅱ 第3回資料 今回の授業で習得してほしいこと: 2次元配列の使い方 (前回の1次元配列の復習もします.)
シミュレーション演習 G. 総合演習 (Mathematica演習) システム創成情報工学科
経営工学基礎演習a PowerPointの利用.
コンピュータグラフィックスS 第13回 第13回 演習(4):シェーディング、マッピング システム創成情報工学科 尾下 真樹
3D散歩ゲーム 08A2043 谷口盛海 種田研究室.
Computer Graphics 第3回 座標変換 芝浦工業大学情報工学科 青木 義満
情報処理 第8回.
CGと形状モデリング 授業資料 1,2限: 大竹豊(東京大学) 3,4限: 俵 丈展(理化学研究所)
視点移動カメラにおけるカメラキャリブレーション
Computer Graphics 第4回 投影・ビューイングパイプライン モデリング 芝浦工業大学情報工学科 青木 義満
電界中の電子の運動 シミュレータ作成 精密工学科プログラミング基礎 資料.
ポリゴンメッシュ (1) - データ構造とレンダリングに必要な計算 -
OpenGLを使ったプログラム作成 澤見研究室
第9回 卒業研究1
点・線分・多角形を レンダリングする方法 東京大学 精密工学専攻 大竹豊.
OpenGLライブラリを用いた3次元フラクタルの描画
5章  3次元形状を2次元面に投影する 3次元空間内に定義した形状を,2次元面上(ディスプレイのスクリーン面,プリンタの紙面など)に投影して表示するために必要になる変換について説明する.
高度情報演習1A “テーマC” 実践 画像処理プログラミング 〜画像認識とCGによる画像生成〜 第二回 演習課題
Computer Graphics 第10回 レンダリング(4) マッピング
3次元構築アプリケーションにおける3D表示(2)
デジタル画像とC言語.
可視面・不可視面の判定方法と隠れ面(不可視面)の消去法について述べる.
DirectX勉強会 第2回.
ポリゴンメッシュ (2) - 変形と簡略化- 東京大学 精密工学専攻 大竹豊 資料および授業の情報は :
階層的境界ボリュームを用いた 陰関数曲面の高速なレイトレーシング法
CGと形状モデリング 授業資料 1,2限: 大竹豊(東京大学) 3,4限: 俵 丈展(理化学研究所)
プロジェクト演習Ⅳ インタラクティブゲーム制作 プログラミング4
コンピュータグラフィックス 実習3: 光線追跡法
地理情報システム論(総)/ 国民経済計算論(商)
プロジェクト演習Ⅳ・Ⅵ インタラクティブゲーム制作
地理情報システム論(総)/ 国民経済計算論(商)
地理情報システム論 第4回 コンピュータシステムおける データ表現(2)
免許法認定公開講座: コンピュータグラフィックス
バネモデルの シミュレータ作成 精密工学科プログラミング基礎 資料.
シミュレーション演習 G. 総合演習 (Mathematica演習) システム創成情報工学科
点・線分・多角形を レンダリングする方法 東京大学 精密工学専攻 大竹豊.
免許法認定公開講座: コンピュータグラフィックス
精密工学科プログラミング基礎Ⅱ 第2回資料 今回の授業で習得してほしいこと: 配列の使い方 (今回は1次元,次回は2次元をやります.)
Presentation transcript:

コンピュータグラフィックスS 第6回 第6回 レンダリング・パイプライン システム創成情報工学科 尾下 真樹 2015/5/19 コンピューターグラフィックスS 第6回 レンダリング・パイプライン システム創成情報工学科 尾下 真樹

今回の内容 レンダリング・パイプライン 座標変換 ラスタライズ OpenGLでのレンダリング設定 OpenGLでのポリゴン描画 Zバッファ法による描画の仕組み 座標変換とラスタライズ 座標変換 ラスタライズ OpenGLでのレンダリング設定 OpenGLでのポリゴン描画

教科書(参考書) 「コンピュータグラフィックス」 CG-ARTS協会 編集・出版 2章 「ビジュアル情報処理 -CG・画像処理入門-」 CG-ARTS協会 編集・出版 1章(8~28ページ) ごく簡単な説明のみ

前回の復習

レンダリング レンダリング(Rendering) カメラから見える画像を計算するための方法 コンピュータグラフィックスS 第6回 2015/5/19 レンダリング レンダリング(Rendering) カメラから見える画像を計算するための方法 使用するレンダリングの方法によって、生成画像の品質、画像生成にかかる時間が決まる オブジェクト 生成画像 光源 カメラ

レンダリングの予備知識 隠面消去 カメラとビューポート 座標変換 面単位での描画 光のモデル 反射・透過・屈折の表現

レンダリング手法 Zソート法 Zバッファ法 スキャンライン法 レイトレーシング法 Zソート法 Zバッファ法 スキャンライン法

Zソート法 Zソート法(ペインタ・アルゴリズム) 描画すべき面を奥にあるものから手前にあるものに順番にソート(整列) 奥の面から手前の面へ順番に描画していく 結果的に、奥の面は手前の面で隠れる 教科書 基礎知識 図2-30

Zバッファ法 画像とは別に、それぞれのピクセルの奥行き情報であるZバッファを持つ Zバッファは画像とほぼ同じメモリサイズを使用 ピクセルあたり16ビット~32ビットを使用 ピクセル単位で処理するので交差も処理できる Zバッファの値(手前にあるほど明るく描画)

スキャンライン法 画像のそれぞれのラインごとに描画 ラインの各スパンごとにどの線分が描画されるかを判定し、それぞれのスパンを描画 教科書 基礎知識 図2.31

レイトレーシング法 最も高品質な(最も実写に近い)画像が得られる方法 カメラからそれぞれの ピクセルごとに視線 方向に半直線(レイ)を 飛ばし、物体との交差 判定によりピクセルの 色を計算 教科書 基礎知識 図2-33

レンダリング手法のまとめ Zソート Zバッファ スキャンライン レイトレーシング 面単位で描画、面単位で隠面消去 面単位で描画、ピクセル単位で隠面消去 スキャンライン ライン単位で描画、ピクセル単位※で隠面消去 レイトレーシング ピクセル単位で描画、ピクセル単位※で隠面消去 ※ 実際には、さらに細かい単位で描画が可能

サンプリング サンプリング(Sampling) コンピュータグラフィックスでは、ピクセル単位で処理を行う 本来は連続的な映像を、ピクセルごとに離散化して扱うことになる そのままではカメラや人間の眼とは異なる画像となってしまうことがある エイリアシング、モーションブラー、被視界深度 このような問題を解決するために、サンプリングの方法を工夫する技術がある

サンプリングの関連技術 アンチエイリアシング モーションブラー 被視界深度

前回の演習の復習

サンプルプログラム opengl_sample.c 地面と1枚の青い三角形が表示される マウスの右ボタンドラッグで、視点を上下に回転

サンプルプログラムの構成 ユーザ・プログラム GLUT main()関数initEnvironment()関数 初期化処理 glutMainLoop() 入力待ち処理 display()関数 描画 reshape()関数 ウィンドウサイズ変更 mouse()関数motion()関数 マウス処理 アニメーション処理 idle()関数 終了処理 main()関数

描画関数の流れ // // ウィンドウ再描画時に呼ばれるコールバック関数 void display( void ) { // ウィンドウ再描画時に呼ばれるコールバック関数 void display( void ) { // 画面をクリア(ピクセルデータとZバッファの両方をクリア) // 変換行列を設定(ワールド座標系→カメラ座標系) // 光源位置を設定(モデルビュー行列の変更にあわせて再設定) // 地面を描画 // 変換行列を設定(物体のモデル座標系→カメラ座標系) // 物体(1枚のポリゴン)を描画 // バックバッファに描画した画面をフロントバッファに表示 }

レンダリング・パイプライン

レンダリングの仕組み ポリゴンモデルによるモデリング(形状表現) Zバッファ法によるレンダリング(描画) 今回の講義の内容 現在、パソコンなどで最も広く使われている手法 OpenGL, DirectX などもZバッファ法を使用 実用に使う可能性が高い 今回の講義の内容 Zバッファ法を使ったポリゴンモデルのレンダリングについて、もう少し詳しい仕組みを説明する 今回の内容を踏まえて、次の演習を行う

Zバッファ法(復習) 画像とは別に、それぞれのピクセルの奥行き情報であるZバッファを持つ Zバッファを使うことで隠面消去を実現 すでに書かれているピクセルのZ座標と比較して、手前にある時のみピクセルを描画 Zバッファの値(手前にあるほど明るく描画)

Zバッファ法による隠面消去(復習) Zバッファ法による面の描画 面を描画するとき、各ピクセルの奥行き値(カメラからの距離)を計算して、Zバッファに描画 同じ場所に別の面を描画するときは、すでに描画されている面より手前のピクセルのみを描画 Zバッファ

レンダリング・パイプライン レンダリング・パイプライン(ビューイング・パイプライン、グラフィックス・パイプライン) 各頂点ごとに処理 各ポリゴンごとに処理 レンダリング・パイプライン(ビューイング・パイプライン、グラフィックス・パイプライン) 入力されたデータを、流れ作業(パイプライン)で処理し、順次、画面に描画 ポリゴンのデータ(頂点データの配列)を入力 いくつかの処理を経て、画面上に描画される 座標変換 ラスタライズ x y z x y z 描画 頂点座標 スクリーン座標

レンダリング・パイプラインの利用 OpenGL や DirectX などのライブラリを使用する場合は、この処理はライブラリが担当 レンダリング・パイプラインの処理を、自分でプログラミングする必要はない 自分のプログラムからは、適切な設定と、入力データの受け渡しを行なう レンダリング・パイプラインの処理をきちんと理解していなければ、使いこなせない ライブラリの使い方も理解する必要がある

GLUTでのZバッファ法の利用 最初のウィンドウ生成時に、Zバッファを使用するように設定 Zバッファを有効にした状態で、OpenGLの関数を使用してポリゴンの描画を行うと、自動的にZバッファ法を使用しながら描画される int main( int argc, char ** argv ) { // GLUTの初期化 glutInitDisplayMode( GLUT_DOUBLE | GLUT_RGBA | ・・・・・・ GLUT_DEPTH); }

入出力の例(サンプルプログラム) 座標変換 ラスタライズ x y z x y z 各頂点ごとに処理 各ポリゴンごとに処理 描画 頂点座標 スクリーン座標 (法線・色・テクスチャ座標) ポリゴンが描画される glBegin( GL_TRIANGLES ); glColor3f( 0.0, 0.0, 1.0 ); glNormal3f( 0.0, 0.0, 1.0 ); glVertex3f(-1.0, 1.0, 0.0 ); glVertex3f( 0.0,-1.0, 0.0 ); glVertex3f( 1.0, 0.5, 0.0 ); glEnd(); OpenGLにポリゴンの頂点情報を入力 座標変換 & ラスタライズ

処理の流れ レンダリング時のデータ処理の流れ 1.ポリゴンを構成する頂点の座標、法線、色、 テクスチャ座標などを入力 各頂点ごとに処理 各ポリゴンごとに処理 レンダリング時のデータ処理の流れ 1.ポリゴンを構成する頂点の座標、法線、色、 テクスチャ座標などを入力 2.スクリーン座標に変換(座標変換) 3.ポリゴンをスクリーン上に描画(ラスタライズ) 座標変換 ラスタライズ x y z x y z 描画 頂点座標 スクリーン座標 (法線・色・テクスチャ座標)

処理の流れ 座標変換 ラスタライズ x y z x y z x y z 座標変換 ラスタライズ x y z x y z 各頂点ごとに処理 各ポリゴンごとに処理 座標変換 ラスタライズ x y z x y z 描画 頂点座標 スクリーン座標 (法線・色・テクスチャ座標) x y z 座標変換 ラスタライズ x y z x y z 教科書 基礎知識 図2-21

描画前に行なう設定 カメラの位置・向き(変換行列)の設定 光源の情報(位置・向き・色など)を設定 テクスチャの情報を設定 各頂点ごとに処理 各ポリゴンごとに処理 カメラの位置・向き(変換行列)の設定 光源の情報(位置・向き・色など)を設定 テクスチャの情報を設定 これらの情報は、次に更新されるまで記録される 座標変換 ラスタライズ x y z x y z 描画 頂点座標 スクリーン座標 カメラの位置・向き 光源の情報 テクスチャの情報

描画データの入力 物体の情報を入力 表面の素材などを途中で変える場合は、適宜設定を変更 各頂点ごとに処理 各ポリゴンごとに処理 物体の情報を入力 ポリゴンを構成する頂点の座標・法線・色・テクスチャ座標などを入力 表面の素材などを途中で変える場合は、適宜設定を変更 座標変換 ラスタライズ x y z x y z 描画 頂点座標 スクリーン座標

ポリゴンデータ ポリゴンの持つ情報 各頂点の情報 面の向き 座標 法線 色 テクスチャ座標 頂点の順番によって面の向きを表す 法線・テクスチャ座標については、詳細は後日の講義で説明 面の向き 頂点の順番によって面の向きを表す 反時計回りに見える方が表(設定で向きは変更可)

ポリゴンの向き(復習) 頂点の順番により、ポリゴンの向きを決定 表から見て反時計回りの順序で頂点を与える 視点と反対の向きでなら描画しない(背面除去) 頂点の順序を間違えると、描画されないので、注意 1 1 3 2 表 裏 2 3

座標変換&ライト計算 座標変換 各頂点のスクリーン座標を計算 法線と光源情報から、頂点の色を計算 面の向きをもとに背面除去、視界外の面も除去 各頂点ごとに処理 各ポリゴンごとに処理 座標変換 各頂点のスクリーン座標を計算 法線と光源情報から、頂点の色を計算 色の計算の方法については、後日の講義で説明 面の向きをもとに背面除去、視界外の面も除去 座標変換 ラスタライズ x y z x y z 描画 頂点座標 スクリーン座標 (法線・色・テクスチャ座標)

ラスタライズ ラスタライズ(ポリゴンを画面上に描画) グローシェーディングを適用 テクスチャマッピングを適用 Zバッファを考慮 座標変換 コンピュータグラフィックスS 第6回 2015/5/19 ラスタライズ 各頂点ごとに処理 各ポリゴンごとに処理 ラスタライズ(ポリゴンを画面上に描画) グローシェーディングを適用 テクスチャマッピングを適用 Zバッファを考慮 座標変換 ラスタライズ x y z x y z 描画 頂点座標 スクリーン座標

ハードウェアサポート ハードウェアによる処理 昔はラスタライズのみをサポート 現在は、座標変換や光の計算もハードウェアサポートされている 各頂点ごとに処理 各ポリゴンごとに処理 ハードウェアによる処理 昔はラスタライズのみをサポート 使用可能なテクスチャの種類・枚数などは増えている 現在は、座標変換や光の計算もハードウェアサポートされている 最近では、ハードウェア処理の方法を変更できるようになっている(VertexShader, PixelShader) 座標変換 ラスタライズ x y z x y z 描画 頂点座標 スクリーン座標

ダブルバッファリング 画面表示の仕組み ビデオメモリ(VRAM)上の画面データをディスプレイ上に表示 描画途中の画面を表示するとちらついてしまう 描画量が少ない場合は垂直同期(VSYNC)中に描画すればちらつかない VRAM 画面情報 描画処理 ディスプレイ

ダブルバッファリング 2枚の画面を使用 ダブルバッファリング 表示用 描画用(+Zバッファ) 描画用の画面に対して描画 描画が完了したら、描画用の画面と表示用の画面を切り替える(もしくは、描画用の画面を表示用の画面にコピーする) 描画用の 画面 描画用の 画面 表示用の 画面 表示用の 画面 ディスプレイ 描画処理

GLUTでのダブルバッファリング 最初にダブルバッファリングの使用を設定 毎回の描画処理後に、画面の切り替えを実行 int main( int argc, char ** argv ) { // GLUTの初期化 glutInitDisplayMode( GLUT_DOUBLE | GLUT_RGBA | ・・・・・・ GLUT_DEPTH); } void display( void ) { ・・・・・・ // バックバッファに描画した画面をフロントバッファに表示 glutSwapBuffers(); }

座標変換

座標変換 座標変換 ラスタライズ x y z x y z x y z 座標変換 ラスタライズ x y z x y z 各頂点ごとに処理 各ポリゴンごとに処理 座標変換 ラスタライズ x y z x y z 描画 頂点座標 スクリーン座標 (法線・色・テクスチャ座標) x y z 座標変換 ラスタライズ x y z x y z 教科書 基礎知識 図2-21

座標変換 座標変換(Transformation) 行列演算を用いて、ある座標系から、別の座標系に、頂点座標やベクトルを変換する技術 カメラから見た画面を描画するためには、モデルの頂点座標をカメラ座標系(最終的にはスクリーン座標系)に変換する必要がある y y z y x x z z x モデル座標系 カメラ座標系 スクリーン座標系

アフィン変換 アフィン変換(同次座標系変換) 4×4行列の演算によって、3次元空間における回転・平行移動・拡大縮小などの処理を計算 (x, y, z, w)の4次元座標値によって扱う 3次元座標値は(x/w, y/w, z/w)で計算(通常は w = 1) 非常に重要な考え方(詳しくは後日の講義で説明)

カメラから見た頂点座標(描画に使う頂点座標) 変換行列の例 変換行列の詳しい使い方の説明は、後日 y z y x 15 (0,1,0) camera_pitch z x ポリゴンを基準とする座標系での頂点座標 カメラから見た頂点座標(描画に使う頂点座標)

プログラムの例 適切な変換行列を設定することで、カメラや物体の位置・向きを自在に変更できる // 変換行列を設定(ワールド座標系→カメラ座標系) glMatrixMode( GL_MODELVIEW ); glLoadIdentity(); glTranslatef( 0.0, 0.0, - 15.0 ); glRotatef( - camera_pitch, 1.0, 0.0, 0.0 ); glTranslatef( 0.0, 1.0, 0.0 );

座標変換の詳細 後日の講義で説明 非常に重要な原理

ラスタライズ

ラスタライズ 座標変換 ラスタライズ x y z x y z x y z 座標変換 ラスタライズ x y z x y z 各頂点ごとに処理 各ポリゴンごとに処理 座標変換 ラスタライズ x y z x y z 描画 頂点座標 スクリーン座標 (法線・色・テクスチャ座標) x y z 座標変換 ラスタライズ x y z x y z 教科書 基礎知識 図2-21

ラスタライズ ラスタライズ ラスタライズの入力 スクリーン上にポリゴンを描画する処理 ポリゴンの各頂点のスクリーン座標(x, y, z)・ 色(r, g, b) テクスチャマッピング時は、さらに、各頂点の テクスチャ座標 (t, v)

ラスタライズ クリッピング 三角面の描画 グローシェーディング、テクスチャマッピング、 Zテスト、などを描画時に実行 グローシェーディング、テクスチャマッピングについては、後日の講義で説明

クリッピング クリッピング ポリゴンの頂点が画面の外側に出ている時は、画面内部の部分だけが残るように分割

三角形の描画 各ラインごとに描画 各ラインごとに両端のピクセルを計算 両端点の間にあるピクセルを描画

(グローシェーディング) 光の効果の計算の時に頂点の色を決定 頂点の色を補間して各ピクセルの色を計算

(テクスチャマッピング) 頂点ごとのテクスチャ座標が与えられる テクスチャ座標を補間してピクセルごとのテクスチャ座標を計算 奥行きの影響が加わるように考慮 ピクセルがなめらかになるように補間

Zテスト Zバッファ法によるレンダリング それぞれの頂点はZ座標値を持つ 頂点のZ値を補間してピクセルごとのZ値を計算 各ピクセルを描画時にZバッファのZ座標と比較 Zバッファ

レンダリング・パイプラインのまとめ レンダリング時のデータ処理の流れ 1.ポリゴンを構成する頂点の座標、法線、色、 テクスチャ座標などを入力 各頂点ごとに処理 各ポリゴンごとに処理 レンダリング時のデータ処理の流れ 1.ポリゴンを構成する頂点の座標、法線、色、 テクスチャ座標などを入力 2.スクリーン座標に変換(座標変換) 3.ポリゴンをスクリーン上に描画(ラスタライズ) 座標変換 ラスタライズ x y z x y z 描画 頂点座標 スクリーン座標 (法線・色・テクスチャ座標)

OpenGLでの レンダリングの設定

レンダリング・パイプラインの設定(復習) 各頂点ごとに処理 各ポリゴンごとに処理 描画の前に、さまざまな設定を行うことができる 各機能を使うかどうか(Zバッファ、背面除去等) カメラの位置・向き(変換行列)の設定 光源の情報(位置・向き・色など)を設定 座標変換 ラスタライズ x y z x y z 描画 頂点座標 スクリーン座標 カメラの位置・向き 光源の情報 テクスチャの情報

描画機能の設定 さまざまな描画機能のオン・オフを設定 glEnable(機能の種類), glDisable(・・・) 不必要な処理はオフにすることで、高速できる 初期状態ではオフになっている機能が多いので、必要な機能はオンに設定する必要がある glEnable(機能の種類), glDisable(・・・) 各機能のオン・オフを変更する GL_LIGHTING, GL_COLOR_MATERIAL, GL_DEPTH_TEST, CL_CULL_FACE, etc 各機能の動作はそれぞれ別の関数で設定

サンプルプログラムの描画機能の設定 標準的な描画の設定(最初に一度だけ設定) void initEnvironment( void ) { ・・・・・・ // 光源計算を有効にする glEnable( GL_LIGHTING ); // 物体の色情報を有効にする glEnable( GL_COLOR_MATERIAL ); // Zテストを有効にする glEnable( GL_DEPTH_TEST ); // 背面除去を有効にする glCullFace( GL_BACK ); glEnable( GL_CULL_FACE ); // 背景色を設定 glClearColor( 0.5, 0.5, 0.8, 0.0 ); }

描画機能の設定(その他) 背面除去の設定 背景色の設定 glCullFace( GL_BACK ) 表面・背面のどちらを描画しないかを設定 glClearColor( r, g, b, a ) 画面をクリアしたときの色を設定

その他の設定 光源の情報(位置・向き・色など)を設定 テクスチャマッピングの設定 これらについては、後日の講義・演習で説明 座標変換 各頂点ごとに処理 各ポリゴンごとに処理 光源の情報(位置・向き・色など)を設定 テクスチャマッピングの設定 これらについては、後日の講義・演習で説明 座標変換 ラスタライズ x y z x y z 描画 頂点座標 スクリーン座標 カメラの位置・向き 光源の情報 テクスチャの情報

レンダリング Zバッファ法によるレンダリング 基本的には、OpenGLが自動的にZバッファ法を用いたレンダリングを行うので、自分のプログラムでは特別な処理は必要ない 最初に、Zテストを有効にするように、設定する必要がある void initEnvironment( void ) { ・・・・・・ // Zテストを有効にする glEnable( GL_DEPTH_TEST ); }

OpenGLでの ポリゴンの描画方法

ポリゴンの描画 glBegin() ~ glEnd() 関数を使用 図形の種類 (各種の点・線・面が指定可能) ※ 頂点データの指定では、一つの関数で、図形を構成する頂点の座標・色・法線などの情報の一つを指定 図形の種類 (各種の点・線・面が指定可能) GL_POINTS(点)、GL_LINES(線分)、GL_TRIANGLES(三角面)、GL_QUADS(四角面)、GL_POLYGON(ポリゴン)、他 glBegin( 図形の種類 ); この間に図形を構成する頂点データを指定 glEnd();

頂点データの指定 glColor3f( r, g, b ) glNormal3f( nx, ny, nz ) これ以降の頂点の色を設定 glNormal3f( nx, ny, nz ) これ以降の頂点の法線を設定 glVertex3f( x, y, z ) 頂点座標を指定 色・法線は、最後に指定したものが使用される

ポリゴンの描画の例(1) 1枚の三角形を描画 各頂点の頂点座標、法線、色を指定して描画 ポリゴンを基準とする座標系(モデル座標系)で頂点位置・法線を指定 y (-1,1,0) glBegin( GL_TRIANGLES ); glColor3f( 0.0, 0.0, 1.0 ); glNormal3f( 0.0, 0.0, 1.0 ); glVertex3f(-1.0, 1.0, 0.0 ); glVertex3f( 0.0,-1.0, 0.0 ); glVertex3f( 1.0, 0.5, 0.0 ); glEnd(); (1,0.5,0) x z (0,-1,0) GL_TRIANGLES が指定されているので、3つの頂点をもとに、1枚の三角面を描画 (6つの頂点が指定されたら、2枚描画)

ポリゴンの描画の例(1) 頂点の色・法線は、頂点ごとに指定可能 指定しなければ、最後に指定したものが使われる y x z glBegin( GL_TRIANGLES ); glColor3f( 0.0, 0.0, 1.0 ); glNormal3f( 0.0, 0.0, 1.0 ); glVertex3f(-1.0, 1.0, 0.0 ); glVertex3f( 0.0,-1.0, 0.0 ); glVertex3f( 1.0, 0.5, 0.0 ); glEnd(); y (-1,1,0) (1,0.5,0) x z (0,-1,0) 省略可能 (前の頂点と同じ色・法線であれば)

ポリゴンの描画の例(2) 1枚の四角形として地面を描画 各頂点の頂点座標、法線、色を指定して描画 真上(0,1,0)を向き、水平方向の長さ10の四角形 // 地面を描画 glBegin( GL_POLYGON ); glNormal3f( 0.0, 1.0, 0.0 ); glColor3f( 0.5, 0.8, 0.5 ); glVertex3f( 5.0, 0.0, 5.0 ); glVertex3f( 5.0, 0.0,-5.0 ); glVertex3f(-5.0, 0.0,-5.0 ); glVertex3f(-5.0, 0.0, 5.0 ); glEnd(); GL_POLYGON が指定されているので、n 個の頂点をもとに、n 角面を描画 (1度に1枚しか描画できない)

ポリゴンの向き 頂点の順番により、ポリゴンの向きを決定 表から見て反時計回りの順序で頂点を与える 視点と反対の向きでなら描画しない(背面除去) 頂点の順序を間違えると、描画されないので、注意 1 1 3 2 表 裏 2 3

背面消去(復習) 背面消去(後面消去、背面除去、後面除去) 後ろ向きの面の描画を省略する処理 バックフェースカリング、とも呼ぶ 後ろ向きの面の描画を省略する処理 サーフェスモデルであれば、後ろ向きの面は描画は不要である点に注目する 仮に描画したとしても、その後、手前側にある面で上書きされる 裏向きの面の描画を省略することで処理を高速化できる(単純に考えると、約半分に減らせる)

背面消去(復習) 後ろ向きの面の判定方法 視線ベクトル(カメラから面へのベクトル)と 面の法線ベクトルの内積により判定 教科書 基礎知識 図2-22 教科書 基礎と応用 図3.5

法線とポリゴンの向き OpenGLでは、法線とポリゴンの 向きは、独立の扱い(要注意) 法線 ポリゴンの向き 1 OpenGLでは、法線とポリゴンの 向きは、独立の扱い(要注意) 法線 頂点ごとに、関数(glNormal3f())により指定 光のモデルに従って色を計算するために使用 (詳細は後日の講義で説明) ポリゴンの向き ポリゴンを描画するとき、頂点の順序により指定 背面除去の判定に使用 法線 3 ポリゴンの向き 2

まとめ レンダリング・パイプライン 座標変換 ラスタライズ OpenGLでのレンダリング設定 OpenGLでのポリゴン描画 Zバッファ法による描画の仕組み 座標変換とラスタライズ 座標変換 ラスタライズ OpenGLでのレンダリング設定 OpenGLでのポリゴン描画

次回予告 OpenGL演習(AV講義室) 連絡 ポリゴンモデルの描画 コンピュータグラフィックスS 第6回 2015/5/19 次回予告 OpenGL演習(AV講義室) ポリゴンモデルの描画 連絡 第3回目の講義中に配布したサンプルプログラムの印刷資料を持って来ること。 欠席した人や紛失した人は、Moodle にアップロードされているファイルを自分で印刷して来ること。