2014年9月30日火曜日

ブラウザでサポートされているWebGLの拡張機能を確認する方法

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title></title>
</head>
<body>
  <canvas id = "canvas">
  </canvas>

  <script>
  var canvas = document.getElementById('canvas');
  var gl = canvas.getContext('webgl') || canvas.getContext('experimental-webgl');

  var extensions = gl.getSupportedExtensions();
  for(var e in extensions){
    document.write(extensions[e] + ",");
  }
  </script>
</body>
</html>

こんな感じで,gl.getSupportedExtensions()を呼び出せば,拡張機能の一覧が取得できる.


2014年9月23日火曜日

OpenGLとDirectXの背面カリング

3Dモデルを描画する際に,画面に映らない部分の描画処理を省く方法として,背面カリング(Back-face culling)というものがある.

この手法自体はOpenGLにもDirectXにも標準で組み込まれていて,設定するだけで簡単に利用できる.

OpenGLの場合,次のように設定する.

// OpenGLの場合
// 背面カリングを有効にする
glEnable(GL_CULL_FACE);
// 反時計回り(counter clockwise)の頂点を持つ面を表と見なす (デフォルト)
// glFrontFace(GL_CCW);
// 時計回り(clockwise)の頂点を持つ面を表と見なす
// glFrontFace(GL_CW);

// WebGLの場合
// var gl = canvas.getContext('webgl');
gl.enable(gl.CULL_FACE);
// gl.frontFace(gl.CCW);
// gl.frontFace(gl.CW);

DirectX 9の場合,次のように設定する.

// ID3DDevice9 * pD3DDevice;
// 背面カリング無し
// pD3DDevice->SetRenderState(D3DRS_CULLMODE, D3DCULL_NONE);
// 反時計回り(counter clockwise)の頂点を持つ面を消す (デフォルト)
// pD3DDevice->SetRenderState(D3DRS_CULLMODE, D3DCULL_CCW);
// 時計回り(clockwise)の頂点を持つ面を消す
// pD3DDevice->SetRenderState(D3DRS_CULLMODE, D3DCULL_CW);

DirectX 11の場合,次のように設定する.

// ID3D11Device *        pDevice;
// ID3D11DeviceContext * pContext;
// ラスタライザーステートの設定に必要なパラメータを設定
D3D11_RASTERIZER_DESC rd;
// 背面カリングをしない場合
// rd.CullMode = D3D11_CULL_NONE;

// 表面を消す場合
// rd.CullMode = D3D11_CULL_FRONT;

// 裏面を消す場合 (デフォルト)
// rd.CullMode = D3D11_CULL_BACK;

// 時計回り(clockwise)の頂点を持つ面を表と見なす (デフォルト)
// rd.FrontCounterClockwise = FALSE;

// 反時計回り(counter clockwise)の頂点を持つ面を表と見なす
// rd.FrontCounterClockwise = TRUE;

// その他のパラメータも設定

// ラスタライザーステートを生成して設定
ID3D11RasterizerState * pState;
pDevice->CreateRasterizerState(&rd, &pState);
pContext->RSSetState(pState);
pState->Release();

デフォルトの設定を整理すると次のようになる.
OpenGL DirectX
消す面
表と見なす面反時計回り(CCW)時計回り(CW)

この設定手順の中で,OpenGLとDirectX 9を比較すると混乱してしまうのが,OpenGLは「表示する面」をCCW(counter clockwise)にするか,CW(clockwise)にするかを指定するのに対して,DirectX 9では「消す面」をCCWにするかCWにするかを指定する,ということだろう.同じような名前の定数を利用するので,同時に扱うと非常に混乱する気がする.

実際混乱している人がいるのか,OpenGLが右手座標系でDirectXは左手座標系だからだ,といった説明もあったが,頂点が時計回りか反時計回りかは座標系と関係が無いので,表示面指定と消去面指定で混乱しているのではないかと思われる.

調べて,実際にコードを書いて挙動を確認した限りでは合っていると思うのだけれど,実際のところ正しいのだろうか?

2014年9月22日月曜日

WebGLのテスト

BloggerでちゃんとWebGLのコンテンツが表示されるかどうかのテスト.






iOS 8でも表示されたけれど,これ1記事を1ページに表示している場合はともかく,複数記事が同時に表示されている場合も特に変更無しにHTMLが表示されているから,canvasのidには注意しないと上手く表示されなさそう.

2014年9月7日日曜日

Windowsコンソールアプリケーションの終了時にポーズする方法

Windowsでコンソールアプリケーションを作る際,特に入力を受け付けないプログラムを作った場合,Visual StudioでF5を押すと結果を確認してしまう前に終了してしまうことがある.C++ Multithreading Cookbookを読んでいたら,system("pause")をmain()のreturnに使う方法が載っていて,なるほどなぁ,と思ったのでメモ.

#include <cstdlib>

int main()
{
    return system("pause");
}

2014年9月5日金曜日

CEDEC 2014に参加してきた

CEDEC 2014に参加してきて,次のようなセッションを聞いたり体験したりしてきました.

9/2 (火)

  • 物語の力 冲方 丁
  • プロシージャルな音ゲーつくろうぜ。
    -BPM解析と格闘した10年、そしてこれからの10年 -
  • 子どもたちのプログラミング学習の現状
  • GameJamでクリエイターに「何が起きたのか?」
    〜バンダイナムコスタジオが挑んだ人材育成の舞台裏〜
  • Houdini EngineとHoudini Indieによるプロシージャルコンテンツ作成
  • TalesOfシリーズにおける自動リギングとワークフロー
9/3 (水)
  • ウェアラブルコンピューティングの動向とウェアラブルゲームへの展開
  • ディジタルゲームにおけるマルチストリーミング再生の理論的な制御方法
  • Intel RealSenceテクノロジーが実現するインターフェース
  • ファイナルファンタジーXIVのファイルシステムとバッチシステム
  • CGにおける運度や変形の記述とその数理
9/4 (木)
  • これからのゲームとゲームクリエイター
  • 「祭り」のゲームデザイン
    〜フリーダムウォーズのゲームデザイン・コンセプト〜
  • Character Transfer
    キャラクタ固有の表情特徴を考慮した顔アニメーション生成手法
  • 実測に基づいた曲率依存反射関数による半透明物体のリアルタイムレンダリング
  • 30〜40人規模の開発チームでマルチプラットフォームタイトルを
    ゲームエンジンから作った理由とその効果
  • ライブラリを作ってはいけない
    〜それでも作りたいあなたへのアドバイス〜
  • 執筆のススメ〜会社勤めをしながら著述賞をとる方法〜
インタラクティブセッション
  • リアルタイムに初音ミクを歌わせるタイプソングシステム「HANAUTA」と
    そのアジャイル型開発
  • バーチャルロープスライダー
  • Oculus VRを用いたテレイグジスタンス(Telexistence)体験
  • HTML5を活用したインタラクティブ物理シミュレーション
    〜タブレット端末による柔軟体・流体の力学計算〜
  • Stick'n Roll
    曲面ディスプレイと棒状インターフェースを用いたアミューズメントシステム
2日目の懇親会(?)では色々な人と話をすることもでき,まだまだ学ばなければならないことが多いなぁ,と刺激を受けました.できればそれぞれの感想も書きたいところですが,今日は疲れたので,明日というか今日,出社して退社して帰ってから書こうかな,と思います.