1/31

日記

2026/01/31

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    完璧だ