Three.js

JSで内積を求める（復習）

this.normalMatrix.getNormalMatrix(this.camera.instance.matrixWorldInverse); //ワールド空間の法線 → カメラ空間の法線” 用の行列。

this.tempV.copy(position); //positionは単位球上の点なので、ワールドの法線として使える
this.tempV.applyMatrix3(this.normalMatrix); //this.tempVをカメラ空間の法線に。

this.cameraToPoint.copy(position);
this.cameraToPoint
        .applyMatrix4(this.camera.instance.matrixWorldInverse)
        .normalize();

const dot = this.tempV.dot(this.cameraToPoint);

下半分について,

position（ワールド座標）を camera.matrixWorldInverse で変換
👉 カメラ座標系（view space）での位置 を得ている

つまりカメラ原点 (0,0,0) から見た point の位置ベクトル

座標変換

やりたいこと	使う行列	得られる空間
ローカル → ワールド	`matrixWorld`	World space
ワールド → ローカル	`matrixWorldInverse`	Local space
ワールド → カメラ	`camera.matrixWorldInverse`	View / Camera space
カメラ → ワールド	`camera.matrixWorld`	World space
カメラ → クリップ	`camera.projectionMatrix`	Clip space
ワールド → クリップ	`projectionMatrix * viewMatrix`	Clip space
クリップ → NDC	`/ w`	NDC
NDC → スクリーン	viewport変換	Screen space

ワールド座標だけで計算する

こっちのが簡単

this.tempV.copy(position);
this.cameraToPoint.subVectors(position, this.camera.instance.position).normalize();

const dot = this.tempV.dot(this.cameraToPoint);

サイト制作

リンクホバー時

アクセシビリティ的に、透明度下げるだけはNGより。色弱が漏れる。下線など視覚的動作を用意する。

英語

considerate and oblivious at the same time 察しの良いところと悪いところの差がすごい

this marks the end これで終わりです

please make your way over to the gym 体育館までお越しください

23rd annual 23年度

they are disqualified 失格

eat to your heart’s content こころゆくまで食べる

venue 会場

nailed it　　　　完璧だ

BLOG

2/3

2/2

2/1

1/31

座標変換対応表

1/30

1/29

1/28

1/27

1/25