テクスチャの原点位置・中心回転させる jit.gl.pix #jitter #maxmsp

テクスチャーの位置や回転を行うjit.gl.pixを書いたのでメモがわりに置いておきます。

<pre><code>
----------begin_max5_patcher----------
2070.3oc6bsraaiCEcsyWgfW1llJ9PulUcvftclESVL.CJLjsTbXGYJAI5Dm
Vz+8gOjskrkrnRDckK7l7fz17dO2CuWZpC42uYxz4oahKlZ8aV+q0jIe+lIS
jMIZXR4+OY5pvMKRBKjuroz3mSm+0o2p5hEugIaNIMLZUbQgEXaWYgrEORnK
mkGufoFAfM9N6asvdPwu7rE+Dx+aquT9dnqWQnIwL4PA12X5Z1gsRhjiK2V9
.LX6XpdcrWxhUC3zoVeQzyOt4FwOtUSe7qD1cYOSnQoOeBuAZGbmysVNPfvO
7kdiqcWdSwKzEs6cvF7N+V8NtcNaUHKmrY5suVeMjwxWSNkaBbEtI11U3f.m
AKpA2NnBSP17l8lQd3pXVb9rXZ37Do+ZOrwXs8aDbf8azQ98KmQ+tk4uBJ+x
j6xHart+y+88y9i+5Ou+y+y8mZxrOPhOdHI9fceM3SS7cuSx2WlLSXzqyiK4
7Usv37ROuz0mL8ARR7Sw4EjTZEqfi8YYUZdRk2h.u9Zp7Cx+1cMQnplb10Td
7Sjsue7tVCy43DiCRBCTxocwS2+wjFEmS4zNgonZjG4JMIYLhxi+EYgKh2GU
hoa+.ltG8cgRX2qD188jYVAPW+8A.NUXYR5h+KNpBOhCqYwTBMKOtHlxBYkt
vttiheHbcBa1CoTVA4aRCAHlCzP+OTZnM1ovUjdwumSBS14CKyIQoTgQTKfH
Zd6vwIWNpIcUcF4qfFl0valya3HSKcVvcx0EyCyEwqxIUvscxRSSp20t2WR7
CrxtyHT5AnHKMq8NyIKe7Du24o7NWcpOaYOEyVSU8NiSMXyJBepNZyBSRJmO
W+ieSHkvKLDyHpP.zdWmpDKOVrHOMIol+p54oF5IhS0WD+LIh8nbfpRF3ubR
1VRzzcQ4Hxx3BV81XgKKp2RA6EEnWoo0yKmJymmuJKg6E0eA7IIjBVwioOWT
9B2RzpB.6WTS0o1USNVq8Skjrdhx2aAq1dCIFwH7cd7LiPrbNI7nDislbr8B
HGljD3U0HZqzvjskGJSzL7nwG6DMfxbGVXvNXX3AC2wAX7T7BKvtE.2Jf33b
GjSOPddpEC2Mh.6Mh3LNPj2qG4nDJfx0SOzPA9BAJbUYK3ffwfBz3.J9fdrB
iBEvwATT7L4aVunG0.3VlI0DoPAiH7Xid7CihG1imRJ1V1ZNgwKvXUTBFG3g
7KHa8RmHBFI+BDPaIv3pwpNr6Kh3OlPjMchHHWO0pRMHj3cQkTUNYw2wX4Pf
tWT4TwlFNFIqIsfllupSzPlCE4KQCSLUYjvMnwg47umt0mlmtlFI1dJqUj77
z7txuJ4IN.PkBwCbEmQBcgP67azgTEb8q7ygkrLRVbFej6DKJIFpUrVVD9Ul
GwtYv.OsAuc+tDlPnss2ORyUzeyvPQ557EaA0s6qfUcSOhOYgP2soo+6NpJ+
K9qWTnuFATWiPrDdwKzLVgitVgsAsh.cMBrAMBwVuomUfLHs.3zGrvXVAVWq
v0jQDjlVQfIgBXOLBigDf9vMMlUXqqU.MnU3qqQ3YPivqOHgonl5lpvnYM6Q
oTSYC5VIsghco4QpmsL3mqk41tkY23xhtYeK+jEJfXCHFTgB.BtJTfqBE3pP
AtJTfQoPAdmEv8iAcs0A.e4tx5o1UVrsA13M7HY6CdmUmnAVokLkjxTItFXv
.ELVDNQcUKbBz.s8wfZ.pg8kB0.3iTarji4nF9WLTisnABXLpAZj7vbdWWa3
ncfRBINFSr.H2KCIjf7UJVVQNLCT3bYvJPtlmUfuPfhxkXXTrXjnrnBBsKzH
P8jI.pblXSj4DdgHyp.Gimt.bYLGA54Y94Hij0ZsHsPu5HPmRUEYBw.LpzSD
6wXVnE5N.9icJta0o8BZq12A6.C73dg9WThOyFK0yrKFaL0mAujTVDBISn56
eUYQpbq9lFNtPVT51YJdNlqJCXTkX8aooqr.Veh6QhMCT7Wgar70bEqtJUXA
BbLglZ7ufjilOX+jmqxQqMEXA.pyZ0U8ncUOZGxLTRi+RWPZAi.AoYpmU8ux
OeefthQAC9EWCFZKjPj84NHouogO2LasEAJ1jxuDpsZlLoF2f5NWBFb1YP5Z
ZH3YmAEzm4cfyJposo41toYFTCoqRFQlLuMR2D2HSJkQjtBbEgN2LH8MM7Ym
Ag5CCxTqYCoqNsQlr1OR2BrxBMFCKb6CVXLqP2ZoHeSFQ76SDwXVQPexrbVq
ni5UsoyZEcr10lL4pwvf9rlvwqB2eKJkVH91GxJVt+5jqAIu1395gkOAVWG+
82ffHmtDFcy5sUC8RCZ+ZRrlBoaPStCm9wEWTjyCoK6Vv3.aIf33OPW7d6tS
GN1+kFjQupHQx85GXazqJRydSQNeMikR0HtgppsB7aNt48ptcDe8gzSbvGno
jhXKr0hGCys.APaNI02VCHwafO6CNFMRyRWtjCucdQt5TdodMTQZ7qJRSnrA
OP+bZdRTOOfKtkmEgieB35.GnFtIL0LHqRmZ5KBUX.XfuHTcN5hPU77BGg2A
rHECe.cc2ibcoFTF.eWZY0enCJn3v0TUBHcrcLcuPpivbsGHOMFn5ao1Aqo9
0OzHcFZugvIgmsQRK3rYzD7lFYPv4xGczXfLBgQGr04L4fG.2CTPDVcmwzaj
WQhxR4UeK1ewVt+t+.BQG+eBkEJUzAX2+M39gaOfv21H4btFIr9yrMOG.Xh4
W0ux.ZYnONChpX2AGQWwXbvQy8fik6wGI21ONtGdTbkGC2lNBthkZbyOt4+w
LZKrO
-----------end_max5_patcher-----------
</code></pre>

Gen で配列をつくる検討 #Max8

リアルタイムグラフィックスの数学勉強中

リアルタイムグラフィックスの数学

シェーダーの勉強がてら、こちらの書籍をMax8上のGenに移植しています。

このような画像作成の学習を通して、数学やシェーダーの理解が向上できそうです。しかし、Max8で実装していく上では直接的に配列が使えないようで少し困っていました。

解決案(とりあえず)

かなり無理矢理ですが、整数の入力に対して変数を返せば良いと考えてSubpatchを作ってみました。と言ってもselector objectなんですが、0はじまりにしてあります。

Length3の配列

配列の長さを3以上に増やしたければ、根性でinletの数を増やさなければなりません。genにおける配列実装に良い解決案をご存知の方いたらコメント/Twitter等で教えて頂けますとありがたいです。

使用例

色の配列を扱う例(arr3に繋いだ三つ目のベクトルが出力されます)

Gen Subpatcher & Subparam 使い方

jit.pix内部のfaderという変数をイジれるようになってる。

jit.pixの中身

gen subpatcherはgen @gen *** で指定。またパラメーターをイジる場合は、setparamを使用する。ちなみにparamは外部公開する変数。

gen subpatcherの中身

外部からイジるパラメーターはparamで指定。

Gen codebox内でfor文を使った平滑化フィルター #maxmsp #jitter

スクリーンショット 2014-10-24 19.37.12
genでfor文の使い方メモ。genで配列使いたい。

Codebox / genexpr

size = 10;
offset = floor(size/2);
scale = 1/(dim+1);
pix = 0;

for(x = 0 ; x < size ; x = x + 1){
	
	for(y = 0 ; y < size ; y = y+1){
	
		delta = (vec(x,y) - offset) * scale;
		pix = pix + sample(in1,norm + delta,boundmode="clamp")/(size*size);
	}
}

out1 = pix;

続きを読む Gen codebox内でfor文を使った平滑化フィルター #maxmsp #jitter

SVGの背景を透過するサンプル jit.mgraphics × jit.gl.pix #maxmsp #jitter #gen

スクリーンショット 2014-10-17 11.57.59jit.mgraphicsで描画したSVGに透過色を持たせたい場合には、jit.gl.pixで特定の色を透過させる処理を書くと良さそうです。上の画像は、カメラのキャプチャにSVGの描画を載せたサンプル。棚がとっ散らかってますが、お気にせず・・・

jit.mgraphicsで背景黒にして描画

スクリーンショット 2014-10-17 11.56.39svgでピンクの丸を描画してます。ちなみにillustratorでSVGをつくりました。(左側に、ちょっと、余分なコードも入ってますがお気にせず。)

jit.gl.pix 黒を透過

スクリーンショット 2014-10-17 12.06.54厳密に言うと、黒に近いほど透過されるコードに成ってますが、とりあえず目的に適うのでオッケーです。

Code(シェーダ部分)


----------begin_max5_patcher----------
757.3oc0WssahCCD84juBK+LKxNAnj8s86.UgLItgoqwNxwbYaU+2WamKjvF
pnkVDqPJANy3wGe73gwuFFfWoNvKwnehVfBBdMLHvC4.Bp+c.dC6PpfU5cCK
46UqdFOpxjgev3geFLiyEiKfCn8fLSsuwimTRSI7B24EMZLoFVs0H3FyeJ3U
StK.KyEKcAbqliGgvXzi0NK2tAjV28LfdDrJHdznZzBlIcMHyWp4olpPGSlZ
mVTzL+qjI9ePFSZCuihR1FOSv+RCLQC4gLOlcA+C5Lb2ofqq0nZQxFEPv2w0
kfR1glAXVQQG3fNCworOq7AZ1nVHPVAQagz7cPy3SZQYZ6B0XWkN4xwxCymg
qL9VXyjeTEhnIN0GQmG6E.5CtWwSiNJD1s97TknZ5WfHiSF04AsuiBU5u4d4
gz.pJ3RPVn4kbogYpYbq4L9SrsByxgyH5a+IVJ+rCdv8p.btFxTRGI5MRGby
zs.Q8IAtmGWLdOjrhAFboccrsbES61AVI3cR0rI+Jknuo1Mc6YHlD1vLbCTQ
1HRaPgMEZPZ5MQbIyFi0koZkPzKTUV1MfkLadQJeOjYV6iUWoz5NTzrEfa0n
LHmWZ5iYX4k8Q5UTnaBa2hC8veuhD8KTTtGdAoyW003YxHFrNQaUgyVYXfpC
csLPEBJweXHwexX5zSKP79EINsPQTDtA+svvluL5qWI2.G9FDw3OqHNm30sI
d4axrqTDo2HQTvk41iO2eIizod8bR7UJjjajPtimhHUe9FTyIeV0Lt5zL0Kl
O7v0IlzjajXBRD8aPEIeVUzVYbpsYApukAxUJh2HMzt5tXQ7BO4RtjJfwj49
WWYt1jgjoi8rH.449KZOyb1GV+JUa0oMIK0+gksEudrz1+fAjssvsnsVxoNt
Fxx52xTUWFktdVp5N7h1s+nbldoTN5+OJ6bjdWP4nKkySteT4jOhLeev4ANW
8NbN5KfynGCOh3eVWa4zaq5n8I2R8jan9u2N8b2L0NOuE9W.Vv2VrA
-----------end_max5_patcher-----------

こういう微妙なコードをBlogに書いとくと、後で再利用しやすいのが良いですね。Max7だと、コードスニペット機能が充実するそうなので、楽しみですな〜。