Three.js: raycaster
Wed May 10 2023 04:26:40 GMT+0000 (Coordinated Universal Time)
Saved by
@yc_lan
//============================== Raycaster ==============================
mouse = new THREE.Vector2(0, 0);
raycaster = new THREE.Raycaster();
document.addEventListener(
"mousemove",
(ev) => {
// three.js expects 'normalized device coordinates' (i.e. between -1 and 1 on both axes)
mouse.x = (ev.clientX / window.innerWidth) * 2 - 1;
mouse.y = -(ev.clientY / window.innerHeight) * 2 + 1;
// update the picking ray with the camera and pointer position
raycaster.setFromCamera( mouse, camera );
// calculate objects intersecting the picking ray
let cloudMeshArray = CloudObjectArray.map((cloud)=>cloud.cloudMesh)
const intersects = raycaster.intersectObjects( cloudMeshArray );
if ( intersects.length > 0 && controls.isLocked == true) { // hit
let found = CloudObjectArray.find( (cloud) => { return cloud.cloudMesh === intersects[0].object});
info.style.color = 'black';
info.innerHTML = found.name;
info.style.display="block";
} else {
info.style.display="none";
}},false);
content_copyCOPY
Comments