情報可視化論（H27年度前期）

Safari の設定
(1) 環境設定　--> 詳細　　--> メニューバーに開発を表示
(2)　開発　--> WebGLを有効

サンプル

学生レポート作品

レポート第01回

レポート第02回

レポート第03回

レポート第04回

レポート第05回

講義資料

2015.04.14

• ガイダンス
• 色覚について
• アンケート (Word / PDF)

2015.04.21

• OpenGLの歴史
• 可視化概要

2015.04.28

• CG 基礎、数学的準備
• 先週の小テストについて

2015.05.12

• グラフィックスパイプライン、三角形の描画
• レポート課題01

2015.05.19

• DrawArrays と DrawElements

2015.06.02

• 開発ツールと DOM API

2015.06.09

• 描画高速化のテクニック

2015.06.16

• glMatrix

2015.06.23

• 射影変換とモデルビュー変換
• 小テスト

2015.06.30

• テクスチャマップ

2015.07.07

• アニメーションと照明

2015.07.14

• まとめと総合演習

ソースコード

• 古いOpenGLでの四角形の描画 Hello_World.c
• WebGLでの三角形の描画 webgl_sample_triangle_00.html
• WebGLでの三角形の描画 webgl_sample_triangle_01.html
• WebGLでの三角形の描画 webgl_sample_triangle_02.html
• WebGLでの三角形の描画 webgl_sample_triangle_03.html
• WebGLでの三角形の描画 webgl_sample_triangle_04.html
• WebGLでの三角形の描画 webgl_sample_triangle_04b.html
• DOM を使用したサンプルプログラム document_object.html
• DOM を使用したサンプルプログラム dom_sample_00.html
• DOM を使用したサンプルプログラム webgl_sample_triangle_02_shader_from_DOM.html
• glMatrixのサンプルプログラム（ベクトル演算） glMatrix_exercise_00.html
• glMatrixのサンプルプログラム（ベクトル演算） glMatrix_exercise_01.html
• glMatrixのサンプルプログラム（ベクトル演算） glMatrix_exercise_02.html
• glMatrixのサンプルプログラム（ベクトル演算） glMatrix_exercise_03.html
• glMatrixのサンプルプログラム（行列演算） glMatrix_exercise_04.html
• glMatrixのサンプルプログラム（行列演算） glMatrix_exercise_05.html
• 座標変換のサンプルプログラム（変換なし） webgl_sample_spiral_00.html
• 座標変換のサンプルプログラム（モデル変換） webgl_sample_spiral_01.html
• 座標変換のサンプルプログラム（モデル変換＋射影変換） webgl_sample_spiral_02.html
• 座標変換のサンプルプログラム（変換行列の push と pop） webgl_sample_spiral_04.html
• テクスチャのサンプル kobe_u_logo_512x256.jpg
• テクスチャのサンプル kobe_u_logo_512x256.png
• テクスチャのサンプル yokohama_512x512.jpg
• テクスチャのサンプル uribos_256x256.jpg
• テクスチャのサンプル kobe_1024x512.jpg
• テクスチャマッピングのサンプルプログラム（基本） webgl_sample_texture_mapping_00.html
• テクスチャマッピングのサンプルプログラム（基本, FLIP_Yあり） webgl_sample_texture_mapping_00b.html
• テクスチャマッピングのサンプルプログラム（テクスチャデータの演算） webgl_sample_texture_mapping_00c.html
• テクスチャマッピングのサンプルプログラム（画像の一部をマッピング） webgl_sample_texture_mapping_00d.html
• テクスチャマッピングのサンプルプログラム（ピクセレーション） webgl_sample_texture_mapping_00e.html
• テクスチャマッピングのサンプルプログラム（ラップモード：REPEAT） webgl_sample_texture_mapping_01.html
• テクスチャマッピングのサンプルプログラム（ラップモード：MIRRORED_REPEAT） webgl_sample_texture_mapping_02.html
• アニメーションのサンプルプログラム（setInterval版） webgl_sample_spiral_05.html
• アニメーションのサンプルプログラム（requestAnimFrame版） webgl_sample_spiral_05b2.html
• アニメーションのサンプルプログラム webgl_sample_spiral_05b.html
• 照明のサンプルプログラム webgl_sample_lighting_00.html
• 照明のサンプルプログラム webgl_sample_lighting_01.html
• 照明のサンプルプログラム webgl_spiral_kobe.html
• Three.jsのサンプルプログラム three_js_sample_cube.html

• glMatrix.js
• webgl-utils.js
• three.min.js