第６回　コンピュータグラフィクス演習（遠隔講義）
テクスチャ

講義に関する質問について

この授業について質問がある場合は、hemmi@sun.ac.jp までメールで問い合わせてください。
その際、件名は 「コンピュータグラフィクス演習の講義について（６）」 としてください。

【注意】ブラウザは Internet Explorer を使っているか確認してください。
　

【エラーメッセージについて】

プログラムが複雑になってくるとエラーが出る場合があります。
その際は「エラーメッセージについて」を参照してください。
　

前回の授業では、物体を拡大縮小する方法を学びました。

今回は、物体にテクスチャを貼り付ける方法について学びます。

テクスチャ（texture）とは、コンピュータグラフィクスの講義で学んだように、物体の表面に張り付けるイラストや画像のことを言います。

物体の表面にテクスチャを貼り付けるとCGにリアルな質感を与えることができます。

●テクスチャを貼る

【文法】ImageTextureノードの url フィールドにテクスチャに使うファイル名を指定する
この時、テクスチャのファイルとVRMLファイルは同じフォルダに入れておく必要があります。

texture ImageTexture{
  url "brick.gif" //テクスチャとして使う画像ファイル名をダブルクォーテーションで囲う
}

#VRML V2.0 utf8
Shape{
  appearance Appearance{
    texture ImageTexture{
      url "brick.gif"
    }
  }
  geometry Box{
    size 1.0 1.0 1.0
  }
}

実行例

テクスチャファイル（brick.gif）はこれをダウンロードして使います　→　brick.gif　

●テクスチャを繰り返し貼る

【文法】TextureTransformノードのscaleフィールドに記述する
　　　　横方向に張り込む枚数と縦方向に張り込む枚数を指定する

textureTransform TextureTransform{
  scale 5.0 3.0   #横の枚数と縦の枚数
}

【例】brick.gifを横に５枚、縦に３枚貼る
#VRML V2.0 utf8
Shape{
  appearance Appearance{
    texture ImageTexture{
      url "brick.gif"
    }
    textureTransform TextureTransform{
      scale 5.0 3.0   #横の枚数と縦の枚数
    }
  }
  geometry Box{
    size 4.0 2.0 2.0
  }
}

実行例

●テクスチャを貼り込む位置を移動する
　　移動方向は±が逆になるので注意してください

【文法】TextureTransformノードに記述

textureTransform TextureTransform{
   translation 0.1 0.1 # （-0.1, -0.1）へ移動（移動方向は±が逆になる）
}

【例】brick.gifを横に-0.1、縦に-0.1移動する
#VRML V2.0 utf8
Shape{
  appearance Appearance{
    texture ImageTexture{
      url "brick.gif"
    }
    textureTransform TextureTransform{
       translation 0.1 0.1
    }
  }
  geometry Box{
    size 1.0 1.0 1.0
  }
}

実行例

●テクスチャを回転して貼り込む
　　回転方向は時計回りになる（物体を回転させる場合とは逆になるので注意）

【文法】TextureTransformノードに記述

textureTransform TextureTransform{
      rotation 0.785 # 45度回転（時計回り）
}

【例】brick.gifを45度回転する（時計回り）
#VRML V2.0 utf8
Shape{
  appearance Appearance{
    texture ImageTexture{
      url "brick.gif"
    }
    textureTransform TextureTransform{
       rotation 0.785 # 45度回転（時計回り）
    }
  }
  geometry Box{
    size 1.0 1.0 1.0
  }
}

実行例

【問題】サイコロを作りなさい。テクスチャは自分で作りなさい。
　ヒント：立方体の1面だけにテクスチャを貼り込むことはできません。
　　　　　この場合は、平面（薄い直方体）を６枚組み合わせて立方体にします。

実行例

第６回の講義はここまでで終了です

１２：１０までに、ここまでの課題が終わったかどうかを返信してください。
返信は、LiveCampusの「授業連絡」から行ってください。
返信内容は、「終わった」または「終わらなかった」のいずれかとしてください。

【返信期限】　

2020年5月25日（月）　１2：10
　　

【返信方法】

LiveCampusの「授業連絡」から「返信」で行ってください。
　

【返信内容】

「終わった」または「終わらなかった」のいずれかで答えてください。

　
以上