サイトマップ
WebGL
- WebGL top
- ブラウザの準備
- WebGL を始める前に canvas を知る
- 3D 描画の基礎知識
- レンダリングのための下準備
- 行列(マトリックス)の基礎知識
- 頂点とポリゴン
- コンテキストの初期化
- シェーダの記述と基礎
- 頂点バッファの基礎
- 行列演算とライブラリ
- シェーダのコンパイルとリンク
- モデルデータと頂点属性
- minMatrix.js と座標変換行列
- ポリゴンのレンダリング
- ポリゴンに色を塗る(頂点色の指定)
- 複数モデルのレンダリング
- 再帰処理と移動・回転・拡大縮小
- インデックスバッファによる描画
- カリングと深度テスト
- 立体モデル(トーラス)の描画
- 平行光源によるライティング
- 環境光によるライティング
- 反射光によるライティング
- フォンシェーディング
- 点光源によるライティング
- テクスチャマッピング
- マルチテクスチャ
- テクスチャパラメータ
- アルファブレンディング
- ブレンドファクター
- クォータニオン(四元数)
- クォータニオンと minMatrixb.js
- マウス座標による回転
- クォータニオンと球面線形補間
- クォータニオンとビルボード
- 点や線のレンダリング
- ポイントスプライト
- ステンシルバッファ
- ステンシルバッファでアウトライン
- フレームバッファ
- ブラーフィルターによるぼかし処理
- バンプマッピング
- 視差マッピング
- キューブ環境マッピング
- キューブ環境バンプマッピング
- 屈折マッピング
- 動的キューブマッピング
- トゥーンレンダリング
- 射影テクスチャマッピング
- 光学迷彩
- シャドウマッピング
- 高解像度シャドウマップ
- グレイスケール変換
- セピア調変換
- sobel フィルタ
- laplacian フィルタ
- gaussian フィルタ
- グレアフィルタ
- 被写界深度
- 距離フォグ
- パーティクルフォグ
- ステンシル鏡面反射
- 半球ライティング
- リムライティング
- 後光 表面下散乱
- mosaic フィルタ
- ズームブラーフィルタ
- ゴッドレイフィルタ
- 深度値と座標系について理解する
- 浮動小数点数テクスチャ
- 頂点テクスチャフェッチ(VTF)
- 浮動小数点数VTF
- VAO(vertex array object)
- 異方性フィルタリング
- インスタンシング(instanced arrays)
- ハーフトーンシェーディング
- ラインシェード シェーダ
- 動画を用いた video テクスチャ
- ウェブカメラをテクスチャに適用する
- 動画テクスチャでクロマキー合成
- VBOを逐次更新しながら描画する
- VBO逐次更新でパーティクル描画
- GPGPU でパーティクルを大量に描く
- MRT(Multiple render targets)
- MRT を利用した多重エッジ検出
- 描画結果から色を取得する readPixels
- フラットシェーディング
- インターリーブ配列 VBO
- スフィア環境マッピング(Matcap Shader)
WebGL2
- WebGL2 top
- WebGL 2.0 と WebGL 1.0
- WebGL 2.0 の有効化
- WebGL 2.0 と GLSL ES 3.0
- layout 修飾子によるロケーション指定
- GLSL の flat 補間モード
- VertexArrayObject
- instanced arrays と VAO
- gl_VertexID と gl_InstanceID
- Uniform Buffer Object(UBO)
- Sampler Object
- MRT (Multiple Render Targets)
- derivative 関数(dFdx, dFdy)
- centroid 修飾子
- Transform Feedback の基礎
- Transform Feedback で GPGPU
GLSL
- GLSL top
- GLSL だけでレンダリングする
- 時間経過とマウスカーソル座標
- オーブ(光の玉)のレンダリング
- 様々な図形を描く
- マンデルブロ集合
- ジュリア集合
- フラグメントシェーダ ノイズ
- シェーダ内でレイを定義する
- レイマーチングで球体を描く
- 法線の算出と簡単なライティング
- 視野角を考慮したレイの定義
- オブジェクトの複製 repetition
- 箱型のボックスモデルを描く
- 異なる形状のオブジェクトを描く
- オブジェクトの重なりを考慮した描画
- オブジェクト同士を補間して結合する
- オブジェクトを行列で回転させる
- オブジェクトを行列で捻じるように変換
- オブジェクトにテクスチャなどを投影する
- レイマーチングソフトシャドウ
canvas 2D
javascript
- 制作するかも