リファレンス inspectHooks()

inspectHooks()

この API は実験中です

p5.js の将来のバージョンで動作が変更される可能性があります。

このシェーダーで利用可能なフックとその現在の実装をログに記録します。

各シェーダーでは、その動作の一部を上書きすることができます。各部分は フックと呼ばれます。フックは、頂点の位置に影響を与える場合は頂点シェーダー用、 ピクセルの色に影響を与える場合はフラグメントシェーダー用です。 このメソッドはそれらの値をコンソールに記録し、 modify()の呼び出しで 使用できるものを知ることができます。

例えば、このシェーダーは以下の出力を生成します:

myShader = baseMaterialShader().modify({
  declarations: 'uniform float time;',
  'vec3 getWorldPosition': `(vec3 pos) {
    pos.y += 20. * sin(time * 0.001 + pos.x * 0.05);
    return pos;
  }`
});
myShader.inspectHooks();
==== 頂点シェーダーフック: ====
void beforeVertex() {}
vec3 getLocalPosition(vec3 position) { return position; }
[MODIFIED] vec3 getWorldPosition(vec3 pos) {
      pos.y += 20. * sin(time * 0.001 + pos.x * 0.05);
      return pos;
    }
vec3 getLocalNormal(vec3 normal) { return normal; }
vec3 getWorldNormal(vec3 normal) { return normal; }
vec2 getUV(vec2 uv) { return uv; }
vec4 getVertexColor(vec4 color) { return color; }
void afterVertex() {}

==== フラグメントシェーダーフック: ====
void beforeFragment() {}
Inputs getPixelInputs(Inputs inputs) { return inputs; }
vec4 combineColors(ColorComponents components) {
                vec4 color = vec4(0.);
                color.rgb += components.diffuse * components.baseColor;
                color.rgb += components.ambient * components.ambientColor;
                color.rgb += components.specular * components.specularColor;
                color.rgb += components.emissive;
                color.a = components.opacity;
                return color;
              }
vec4 getFinalColor(vec4 color) { return color; }
void afterFragment() {}
Notice any errors or typos? Please let us know. Please feel free to edit src/webgl/p5.Shader.js and open a pull request!

関連するリファレンス