2008年度　イントロダクトリセミナー（システム環境情報学研究室）第１回目

２００８年度　システム情報科学特別演習（イントロダクトリセミナー）

サイバーフィールド実習
実世界の３次元モデル構築　第１回目

担当：システム環境情報学研究室　小野里　雅彦
最終改訂：２００８年５月１３日

３次元世界の表現の基礎

３次元の世界をコンピュータ内に構築する場合に，考えなくてはならないことは，

もの（対象）の配置をどのように表現するか？【配置】
もの（対象）の形をどのように表現するか？【形状】
もの（対象）の色や質感などをどのように表現するか？【外観】
仮想世界を観察する視点（カメラ）をどのように設定するか？【視点】
仮想世界を照らす照明をどのように設定するか？【照明】
仮想世界の運動や変形，性質の時間変化をどのように実装するか？【変化】

などがあります．それぞれが重要な内容ですが，この演習では配置と形状を主な取り扱いの対象とします．

●　３次元空間内の対象の配置　●

３次元空間内での対象の配置を扱う上で基礎となる考え方は，以下のように整理されます．

仮想世界の基準を現す基準（世界）座標系と，各対象物などに固定された対象（局所）座標系を考えまる．
２つの座標系の配置の関係は，座標変換行列によって与えられます．３次元空間では４行４列の同次変換行列で与えられる．１６の要素の内，独立なパラメータは位置のパラメータ３，姿勢のパラメータ３の合計６です．
座標系は座標変換行列を介して，数珠繋ぎにつないでいくことができます．たとえば，座標系[A]と座標系[B]との間は同次変換行列T1，座標系[B]と座標系[C]との間は同次変換行列T2で関係が付けられているとき，[A]←T1-[B]←T2-[C]のように座標系[A]と座標系[C]とは結びつけられ，それらの間の座標変換行列は，T1とT2を合成した（行列の積を作成した）T1T2となります．すなわち，[A]←T1T2-[C]となります．
座標系は一般に基準座標系を根元とした木構造を形成します．
この木構造の末端(葉)には，形状が定義された対象物や視点が定義されたカメラ，光源の性質が定義された照明（ライト）が付きます．

●　３次元形状の表現　●

３次元形状の定義を行う方法は沢山の方法があります．それについては，金井理先生の講義（ディジタル形状設計，システム情報設計学特論）で学習している（あるいはこれから学習する）と思いますので，省略します．この演習では，

形状を基本立体の集合として定義する
形状を小さな平面分の集まりからなる表面で定義する

という２つについて扱います．

基本立体としては，通常，直方体（立方体を含む），円柱，円錐，多角柱，多角錐，球，トーラス，正多面体などがあります．これらの基本立体はそれぞれに寸法を決めるパラメータが定義されます．例えば直方体では縦・横・高さの３つ，円柱では底面の半径と高さの２つ，球では半径の１つ，といった具合です．こうしたパラメータを指定して生成した形状を空間内の適切な位置に配置します．

３次元ＣＡＤなどの形状モデラでは，こうした基本立体の間の集合演算（和，積，差）などを行うことができて複雑な形状を作成することができますが，表示のみを対象としたソフトウェアでは，基本的には立体の重ね合わせのみを行います．

基本立体で表現できない形状に関しては，小さな面の集まりで表現することができます．ここでは面は辺が線分で構成される多角形(polygon)とします．多角形はそれを構成する頂点の並びで表現できますので，多角形の表現は頂点の座標や，頂点の番号を順に記述することが行われます．コンピュータグラフィックスの世界では，頂点の順番の向きは面の表側からみたときの反時計回り(CCW)が使用されることが多いことは覚えておいた方がよいでしょう．

VRMLについて

VRMLとはVirtual Reality Modeling Languageの略で，WWW上で３次元のグラフィックスを表現するための言語です．1994年に静的な世界を表現するVRML1.0が制定され，その後，動きを取り入れたVRML2.0は1998年にISOによってVRML97として国際標準規約に制定されています．その後，VRMLはより強力な機能拡張をもつ X3D(Web 3D)へと発展していっていますが，仮想世界構築の基礎を学ぶには，まだ十分な機能があると考えています．今回の演習では，第２回目の３次元スキャナの生成するデータ形式との整合のため， VRML2.0を使用します．

VRMLで定義された世界をウェブブラウザで見るためには，専用のプラグインが必要です．今回の演習で使用しているノートＰＣには

ParallelGraphics社 Cortona VRML Client Ver 5.1: URL http://www.parallelgraphics.com/products/cortona/

がインストールされています．これにより通常のIEでwrlの拡張子のついた VRMLのファイルをブラウジングすることができます．

VRMLを体験する最もシンプルなプログラムを作成してみましょう． Windowsのメモ帳などのエディタを使って次を内容を含むファイルを作成してみましょう．保存するファイル名は，例えばCone1.wrlのように拡張子をwrlとします．

＃VRML V2.0 utf8

Shape{
geometry Cone{ }
}

画面に三角錐（コーン）が表示されたと思います．（Cone1.wrl）ただ，色も何もついていないので，次のような定義をしたファイルCone2.wrl を作成してみます．

#VRML V2.0 utf8

Shape{
appearance 
    Appearance { material Material 
                         { diffuseColor 0 1 0 } } 
geometry Cone{ bottomRadius 1 
               height 2 side 
               TRUE bottom TRUE} }
}

これで色が付きました．パラメータを色々と変えてどのように変化するかを確かめて見てください．（Cone2.wrl）

次に，もう少しいろいろな要素が入った例を挙げます．

#VRML V2.0 utf8

NavigationInfo {type ["EXAMINE","ANY"]}

Background {
	groundColor 0.000000 0.000000 0.000000
	skyColor 0.000000 0.000000 0.000000
}

DirectionalLight {
	intensity 1.000000
	ambientIntensity 0.200000
	color 1.000000 1.000000 1.000000
	direction -0.691714 -0.691714 -0.207514
}

Viewpoint {
	position 2.000000 2.000000 3.000000
	orientation -0.637495 0.745885 -0.193018 0.771213
	description "current camera"
}

Transform {
  translation 0 0 0
  rotation 0 0 1 0
  scale 0.001000 0.001000 0.001000
  children [
    Transform {
      translation 0 0 0
      rotation 0 0 1 0
      scale 1 1 1
      children [
        Shape {
          appearance Appearance {
          material Material {
            specularColor 1 1 1
            diffuseColor 1.000000 1.000000 1.000000
            ambientIntensity 0
            transparency 0.000000
            shininess 0.200000
            emissiveColor 0 0 0
            }
          }
       geometry IndexedFaceSet {
         ccw FALSE
         solid FALSE
         creaseAngle 3.14
         coord Coordinate {
         point [
               700.000000 700.000000 -550.000000, # 0
               700.000000 0.000000 -550.000000, # 1
               700.000000 700.000000 550.000000, # 2
               700.000000 0.000000 550.000000, # 3
               700.000000 700.000000 550.000000, # 4
               700.000000 0.000000 550.000000, # 5
              -850.000000 700.000000 550.000000, # 6
              -850.000000 0.000000 550.000000, # 7
              -850.000000 700.000000 550.000000, # 8
              -850.000000 0.000000 550.000000, # 9
              -850.000000 700.000000 -550.000000, # 10
              -850.000000 0.000000 -550.000000, # 11
              -850.000000 700.000000 -550.000000, # 12
              -850.000000 0.000000 -550.000000, # 13
               700.000000 700.000000 -550.000000, # 14
               700.000000 0.000000 -550.000000, # 15
              ]
            }
            coordIndex [
                2, 3, 1, 0, -1, 
                6, 7, 5, 4, -1, 
               10, 11, 9, 8, -1, 
               14, 15, 13, 12, -1, 
               ]
      }
    }
  ]
 }
]
}

# End of the file

４つの面で構成される立体が表示されたと思います．（FourFaces.wrl）背景，照明，視点が設定され，表示する立体に対するスケーリング（縮小）が施されています．ここで記述されている各内容がどういう意味なのかは，VRMLの文法について記したWEBサイトを参照してください．

● VRML2.0 TUTORIAL (Masashi Sanae) http://www.nikonet.or.jp/spring/sanae/VRML2/Vrml2.htm
● 福井高専　about VRML2.0　http://www.ei.fukui-nct.ac.jp/~yfa/close/VRML/index.html
● 鹿児島大学　仮想世界の体験と構築～ VRML2.0 超入門～　http://www.ics.kagoshima-u.ac.jp/edu/taiken97/Page/index.html
●VRMLaboR 　http://www.atom.co.jp/vrml2/labo/index.html
●VRMLモデル素材，ショッピングモール　http://www.ocnus.com/vrml.html

VRMLの演習の終わりにもう少し複雑な例をあげておきましょう．

ファイル　Example.wrl
#VRML V2.0 utf8

Viewpoint {
	position 10 0 10
	orientation 0 1 0 0.8
}

Background {
	skyAngle[1.8]
	skyColor[0.3 0.6 0.8]
	groundColor [0.2 0.5 0.6]
}

Transform {
	translation 0 0 0
	children [
	Transform {
		translation -1 0 0
		children [
			Shape{
				appearance 
    					Appearance { material Material 
                        			 { diffuseColor 0 1 0 } } 
				geometry Cone{ bottomRadius 1 
               				height 2 
               				side TRUE
               				bottom TRUE }
				
				}]
	}
		
	Transform {
		translation 1 0 0
		children [
			Shape{
				appearance 
    					Appearance { material Material 
                        			 { diffuseColor 1 0 0 } } 
				geometry Box{ size 1.3 1.4 2 }
				}]}
	Inline{url "./FourFacesb.wrl"}
	]
}

ファイル　FourFaceb.wrl 

#VRML V2.0 utf8

Transform {
  translation 0 3 0
  rotation 0 0 1 0
  scale 0.001000 0.001000 0.001000
  children [
    Transform {
      translation 0 0 0
      rotation 0 0 1 0
      scale 1 1 1
      children [
        Shape {
          appearance Appearance {
          material Material {
            specularColor 1 0.5 1
            diffuseColor 1.000000 0.500000 1.000000
            ambientIntensity 0
            transparency 0.000000
            shininess 0.200000
            emissiveColor 0 0 0
            }

          }
       geometry IndexedFaceSet {
         ccw FALSE
         solid FALSE
         creaseAngle 3.14
         coord Coordinate {
         point [
               700.000000 700.000000 -550.000000, # 0
               700.000000 0.000000 -550.000000, # 1
               700.000000 700.000000 550.000000, # 2
               700.000000 0.000000 550.000000, # 3
               700.000000 700.000000 550.000000, # 4
               700.000000 0.000000 550.000000, # 5
              -850.000000 700.000000 550.000000, # 6
              -850.000000 0.000000 550.000000, # 7
              -850.000000 700.000000 550.000000, # 8
              -850.000000 0.000000 550.000000, # 9
              -850.000000 700.000000 -550.000000, # 10
              -850.000000 0.000000 -550.000000, # 11
              -850.000000 700.000000 -550.000000, # 12
              -850.000000 0.000000 -550.000000, # 13
               700.000000 700.000000 -550.000000, # 14
               700.000000 0.000000 -550.000000, # 15
              ]
            }
            coordIndex [
                2, 3, 1, 0, -1, 
                6, 7, 5, 4, -1, 
               10, 11, 9, 8, -1, 
               14, 15, 13, 12, -1, 
               ]
      }
    }
  ]
 }
]
}

このExample.wrlをブラウザに読み込む，FourFacesb.wrlで定義された形状が Inlineという命令によって取り込まれています．（Example.wrl）これによって複数のファイルに定義されているVRMLの形状を１つのシーングラフにまとめることができます．配置や照明などをいろいろと変化させてみましょう．

演習担当:
　　　　　小野里　雅彦まで．
onosato@ssi.ist.hokudai.ac.jp　　情報科学研究科棟5-14　内線6435

サイバーフィールド実習 実世界の３次元モデル構築 第１回目

３次元世界の表現の基礎

● ３次元空間内の対象の配置 ●

● ３次元形状の表現 ●

VRMLについて

サイバーフィールド実習
実世界の３次元モデル構築　第１回目

●　３次元空間内の対象の配置　●

●　３次元形状の表現　●