日々の記録 2025-03-29

raycaster の intersectObjects が期待した結果を返さない

onClick の時の座標算出方法を window ベースではなく エレメントベースにする

const element = event.currentTarget;

currentTarget ではなく srcElement っぽい ?

ただ、srcElement は deprecated。

target かな ?

とれたようなとれていないような。

raycaster の intersectObjects の最も近い位置のオブジェクトが期待したものと違う

本当にうまく取れているのだろうか ?

クリックしていない時に候補としてリストアップされていない事を確認

	for (const intersect of intersects) {
		const obj = intersect.object;
		if (obj instanceof THREE.Mesh) {
			console.log(`Mesh ${obj.name} clicked`);
		}
	}

mesh をクリックしたら反応して、クリックしていなかったら反応しなかったので、たぶんあっている。

intersectObjects[0] の型は何だろう ?

typeof で返ってくるのは Object
どのクラスを返してきたのか調べる方法はない ?

console.log(intersectObjects[0]) で一覧になる key をすべて持つクラスを探す感じ ?

intersectOBject は特定の型を返すわけではなさそう

https://threejs.org/docs/#api/en/core/Raycaster.intersectObject

Visual Studio Code を使って Go to Imprementations で定義位置を表示して

function getIntersectSphereMesh<TIntersected extends THREE.Object3D>(
		intersects: Array<THREE.Intersection<TIntersected>>
		) : THREE.Mesh | null {

こんな感じで関数を定義したら引数に intersectObjects を受け取れた

TransformControls 作成

new して update() するだけだとマニピュレーターが描画されない。
getHelper() したものを Scene に add する必要もある。

あと update に delta を渡すのが必須になっている。
OrbitControls も update に delta を渡せるようになっていた。