2:00 過ぎ消灯。就寝。

7:05 起床。納豆と米を食う。雨につき傘を持って出勤。ゴム長を装備。

7:45 現場。可燃ゴミの日だがヤバいゴミはない。助かる。 ということはさっさと搬出すると外の清掃がないからヒマになる。 管理人室の床を拭きまくって時間つぶし。薄い埃の層が全然除去されない。

10:00 業務終わり。撤収。雨が強い。

10:20 ビッグエー墨田京島店。274 円。

  • 絹豆腐
  • ハムマヨパン
  • ポテチ塩
  • コッペパンンジャム＆マーガリン

強風にあおられ、傘のスポークが一本ダメになる。イトーヨーカドー曳舟店。体温チェックのみ。

曳舟の部屋に戻る。窓を閉めておいてよかった。濡れた服を脱いで PC をやる。 おっと忘れていた。手を石鹸で洗う。

  • WebGL2 Picking
    • これを読みたかった。昔古い OpenGL を利用して CAD を作っていたので、 API が一新されたモダンな OpenGL でどう実現するのか、わりと興味がある。
    • ID を描画要素に何らかの手段で埋め込む？ あるいは別の場所に描く？
    • ついにレンダーバッファー投入。
    • ピック専用シェーダープログラムを用意する。
    • このレイアウト修飾子のくだりは別の回で読んだ。
    • オブジェクトすべてを二度 render する。
    • 今回はマウスを使う。そういうコードを書くのには慣れているていでいく。
    • gl.readPixels という関数があり、それを利用する。あとで旧 OpenGL の場合を調べたい。
    • この例題ではピックされた幾何を点滅させるという、上等なことを実現している。 私どもの CAD ではせいぜい静的にハイライトするどまりだった。
    • ワンピクセルの逆投影という手法がやはり有効なようだ。 そのときにはワンピクセルを表すバッファーを併せて生成する。

    ではコードを書こう。Drawing Multiple Things の回をベースとする。

    • 既存のシェーダープログラムはそのまま活かす。
    • まず、テクスチャー、フレームバッファー、レンダーバッファーのコードを書く。 ここは API リファレンスを引きつつ、じっくりと理解する。

12:00 おやつを支度するが、コードを書く手を止めない。

  • 印南　ガン牌 - YouTube: ビデオが存在したのか。ガン牌復活のカットは原作でもド迫力の見開きだったと記憶している。
  • 【北海道編】旅先の麻雀で本気出したら、とんでもない結果になった - YouTube: 麻雀していない。
  • ピック続き
    • キャンバスのサイズ変更時に特別なリセット処理が要るので、 drawScene にそれを仕込む。
    • ピック専用シェーダープログラムを書く。きわめて単純なコードだが、 断片シェーダーの出力が色であるはずなのに、なんらかの ID を代入していることに注意。 先ほどの gl.framebufferTexture2D 呼び出しの意図はこれだ。
    • シェーダーソースを全部書いた時点でコンパイル呼び出しを書く。 これまでの演習と同様にヘルパー呼び出しで済ませる。
    • 前回のオブジェクト描画コードを関数の形式に書き換える。 シェーダープログラムを変えて二度描画する必要があるので、こういうことをする。
    • drawScene で今書いた関数を二度呼び出すように変える。 以前やったように、先にフレームバッファーに、それからキャンバスに描画する。

13:40 作業の途中だが昼寝。外は大雨だ。

16:55 起床。よく寝た。夢の中で里帰りを試みていた。混沌とした内容だった。 外の大雨が相変わらずで、傘も壊れていて、恒例の秋葉原行きは断念する。無念だ。

PC に戻る。テザリングのときに携帯電話の画面を見て、今月に入ったばかりだというのにもう通信量 1.0GB を超えていることに気づく。あちゃあ。YouTube は怖い。

  • ピック続き
    • 200 個の幾何を仕掛けているコードにピック用の ID を一様変数の集合に加える。 JavaScript 側ではこの 4 バイト長整数値を 1 バイトごとに長さ 4 の配列にバラす。 昔のドラクエのようだが、ここでは各バイトをさらに 255 で除算して正規化浮動小数点数とする。
    • canvas.onmousemove を実装し、マウス位置を記憶する。
    • 二度の drawObjects 呼び出しの間に gl.readPixels 呼び出しを含め、ID を復元する。 座標変換の -1 は要らないだろう。 また、このコードを見ると、整数型ベクトルをシェーダーで使えばいいのではという気になる。
    • ハイライトを実装する。点滅するのにフレーム数を利用する。8 フレームごとに赤と黄が交代する。

17:35 ピック初版完成。続いて最適化をする。 テクスチャー全域に対して ID をチェック、仕込む必要はなく、マウスのあるピクセルだけでいい。 それを実現するために、いつものように行列を二つに分割し、昔あった gluUnproject のような処理を書く。

  • gluUnproject のような処理を書く。ただし m4.frustum を利用する。
  • 頂点シェーダー二つの行列を投影行列とそれ以外とに分解する。
  • 各図形に持たせていた投影行列は不要となるので、いったん削る。
  • キャンバスサイズ変更時のテクスチャー更新処理が不要となる。 その代わり、最初に一度だけ、サイズ 1x1 でテクスチャーを生成しておく。本文に言及がない？
  • テクスチャーに描画する際、gl.viewport と gl.readPixels を 1x1 対応する。
  • 削った投影行列の定義をキャンバスへの描画直前に移す。

18:25 ピック終わり。外が静かになった気がするが、雨がやんだだけで風が強いままだ。 もうしばらく様子を見たい。晩飯の予定も秋葉原でそばを食うつもりでいたから、考える。

近所のスーパーに晩飯を求めに外出。雨は完全にやんでいるが、インソールを着脱する手間を省いてゴム長で歩く。

20:05 コモディイイダ東向島店。457 円。ついでにダンボールを一つ失敬。

  • 天丼（牡蠣＆舞茸）
  • かつおたたきのっけ

強風でダンボールがあおられる。曳舟の部屋に戻る。PC に戻る。残作業。

風呂に入る。久しぶりに湯を張る。すぐに温くなる。

21:35 風呂から出る。PC に戻って晩飯。豪奢な晩餐になった。 天ぷらの内容は牡蠣、舞茸、エビ、レンコン、シシトウ、アスパラガス、カボチャだ。いいね。 カツオのタタキも美味い。いざとなったらポン酢で追加しようと思ったが、備え付けられているドレッシングで十分だ。 麻雀を練習しながらもりもり食う。

22:25 晩飯終了。インターネットに接続して遊ぶ。

  • #672 GB版 ボンバーキング シナリオ2 Blaster Master Boy BGM ギターメドレー - YouTube: 冒頭の楽曲は二度は演奏済みだと思う。説明されているように歌唱付きもあった。
  • 理論値を狙ってみる みかもだし - YouTube: 今日は回線が一時的に太いのでリアルタイムで聴ける。 理論値狙いに疲れてスタメン楽曲をプレイするのも本放送の見どころだ。
  • WebGL2 GPGPU
    • GPGPU の急所はテクスチャーを二次元の配列として扱うことらしい。 最初の例はそのデモとなる。これまでの回で得た知識で理解することが可能。
    • 次に変換反響の技法を扱う。gl.transformFeedbackVaryings を使うようなものだ。 このため、シェーダーソースを久しぶりに自力でコンパイル、リンクすることになる。
    • ここまでは理論編で、実践編は粒子の等速運動のデモからだ。 ザッと読んでいると、このプログラムのどこで変換反響が活用されているのかがわからないのがいい。
    • 点に最も近い線分を得る問題は面白い。昔の仕事で似たようなことを GPU なしでやったが、どうなるか。 最初のシェーダーソースが brute force なアルゴリズムであることがミソ。わざとそうしている。
    • 一次元的なデータでも二次元テクスチャーに表現し直さなければならないわけだが、 実装上の制約があり、1xN のようなテクスチャーは一般には生成できない。
    • 粒子の運動プログラムと線分問題をマージする。線分まで運動させなくてもいいではないか。
    • GPU は CPU ほど精度が良くない。

ああ、一日が終わる。