Skip to content

Instantly share code, notes, and snippets.

@nishinoshake
Last active June 22, 2016 12:57
Show Gist options
  • Save nishinoshake/795364c0f0bff64d7a8c4fb7891bc173 to your computer and use it in GitHub Desktop.
Save nishinoshake/795364c0f0bff64d7a8c4fb7891bc173 to your computer and use it in GitHub Desktop.
GLSLがわからん

##GLSL webGL Shader Language シェーダを記述するための言語
書き方はほとんどC言語

##シェーダってなにさ 3Dモデルを構築するのに必要な概念 ざっくりいえば位置を決める頂点シェーダと、
色を決めるフラグメントシェーダがある。

##書き方 HTMLに埋め込む。

//頂点シェーダ
varying vec2 vUV;
void main() {
  gl_Position = projectionMatrix * modelViewMatrix * vec4(position,1.0);
  vUV=uv;
}
</script>
<script id="fshader" type="x-shader/x-fragment">
//フラグメントシェーダ
varying vec2 vUV;
uniform sampler2D tex;
uniform sampler2D palette;
void main() {
  float val= texture2D(tex, vUV).a;  
  gl_FragColor =texture2D(palette,vec2(val,0.5));
}
</script>

##変数 型が必須で、必要であれば修飾子もつける ###型

  • void => 値なし
  • bool => 真偽値
  • int => 符号付き整数
  • float => 単精度浮動小数点のスカラー
  • vec2 => 2要素のベクトル
  • vec3 => 3要素のベクトル
  • vec4 => 4要素のベクトル
  • mat2 => 2×2の浮動小数点行列
  • mat3 => 3×3の浮動小数点行列
  • mat4 => 4×4の浮動小数点行列

###修飾子

  • attribute => 頂点シェーダのときに指定する
  • uniform => アプリケーションから変数を渡すときに指定する
  • varying => 頂点シェーダからフラグメントシェーダへ渡す時に指定する
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment