👁 td_final.png

はじめに

👁 bandicam-2017-09-11-15-28-47-9221.gif

TouchDesignerでは、RGBAチャンネルをそれぞれ抜き出すノードがありません(見つけきれてないだけかも...)。
ので、GLSLで対処してみます。

サンプル

サンプルはこちら(GitHub)に置いています。

解説

色空間の変換

RGB値を抜き取りたい場合はこの工程を無視して頂いて結構です。
👁 2017-09-11_170014.png

読み込んだファイルをHSV色空間に変換しています。
ややこしいですが、HSV値はそれぞれRGBに格納されます。
そのため、輝度を取り出したい場合はBチャンネルの値を抜き出せばよいことになります。

チャンネルごとに値を取り出す

👁 2017-09-11_170755.png

GLSL TOPを用いて、指定したチャンネルのピクセル値を取り出します。
GLSLでは、ベクトル値のアクセスにxyz, rgb, [index]の形でアクセスすることができますから、
今回は[index]の形で取り出しています。

uniform int channel;

out vec4 fragColor;
void main() {
 vec4 tex = texture(sTD2DInputs[0], vUV.st);
 vec4 color = vec4(vec3(tex[channel]), tex.a); // <- 
 fragColor = color;
}

👁 2017-09-11_165929.png

取り出すチャンネルはスライダーで設定できるようにしてみました。
👁 2017-09-11_170939.png

スライダーの値は0-1の範囲で動きますので、Math CHOPで3倍にしておき、0-3で動くようにしておきます。

結果

👁 2017-09-11_171313.png

色相

👁 2017-09-11_171330.png

彩度

👁 2017-09-11_171354.png

明度

と、それぞれのRGBチャンネルを抜き出すことができました。