WebGL+HTML5で3DCGを勉強してみた！ Part3
どうも。営業部の伊藤です。
長期化しておりますが、、、続けます！！！
Part2でSTEP3の「シェーダを生成＆コンパイル」まで説明が終わりましたので、今回のブログではSTEP4の「モデルデータを用意」とSTEP5の「モデルデータからVBO(VertexBufferObject)を生成＆バインド」を書きます。
早速モデルデータを用意したいところですが、その前にプログラムオブジェクトを作成する必要があります。
プログラムオブジェクトとはなんぞや？？
Part1のフラグメントシェーダ(ピクセルシェーダ)説明部分、Part2のvarying説明部分でも書きましたが、varying修飾子変数を利用してシェーダ間で頂点情報を橋渡しする必要があります。
この橋渡しを実現するためのオブジェクトがプログラムオブジェクトであり、WebGL側との連係もこのオブジェクトを利用します。
var fShader = setShader(“fragment”);
shaderProgram = gl.createProgram();
gl.attachShader(shaderProgram, vShader);
gl.attachShader(shaderProgram, fShader);
gl.linkProgram(shaderProgram);
setShader関数でバーテックスシェーダ(頂点シェーダ)とSTEP3のフラグメントシェーダ(ピクセルシェーダ)の生成＆コンパイルまで実施し、その後にプログラムオブジェクトを生成(createProgram)しています。
そして、作成したプログラムオブジェクト(shaderProgram)に各々のシェーダを割り当てた(attachShader)後にリンク(linkProgram)しています。
これでパラメータ受け渡しの準備は完了しましたので、本題の「モデルデータの用意」と「VBO(VertexBufferObject)の生成＆バインド」に進みます。
“WebGL+HTML5で3DCGを勉強してみた！ Part3” の続きを読む
