A beginner question :
how can i push scene.childern to an array and pass the array to intersect.objects because it seems that intersect does not recognize scene.children objects in blow
function onMouseMove(e) {
let mouse = new THREE.Vector2(
(e.clientX / window.innerWidth) * 2 - 1,
(e.clientY / window.innerHeight) * 2 + 1
);
let intersects = rayCaster.intersectObjects(scene.childern);
intersects.forEach(function (intersect) {
if (intersect.object.type === “sprite”) {
let proj = intersect.object.position.clone().project(camera);
tooltip.style.top = ((-1 * proj + 1) * window.innerHeight) / 2 + “px”;
console.log(tooltip.style.top);
}
});
}
and this is my Codepen:https://codepen.io/hamidrezashahnazari/pen/eYdbxpg
Thanks for your help.
You need to pass “true” in for the “recursive” argument otherwise only a shallow check will be done:
let intersects = rayCaster.intersectObjects(scene.children, true);
See the docs on the the function here.
I pass true but again it doesn’t work properly and I got below warning on my chrome console
THREE.Raycaster.intersectObjects: objects is not an Array.
Check to make sure the values that are being passed into the function are what you’re expecting them to be.
If the above code is exactly what you are running then children
has been misspelled in scene.childern
sorry because of the mistake I have misspelled here but in my code it doesn’t work correctly
Unfortunately without a running demo it’s not going to be possible to help debug the issue. But if three.js is logging that the passed argument is not an array then it’s likely the arguments passed in are incorrect.
@Hamid_Shah
give it a try like this…
raycaster.setFromCamera( mouse, camera );
let intersects = raycaster.intersectObjects( scene.children, true );
if ( intersects.length > 0 ) {
if (intersects[0].object.type === “sprite”) {
console.log(intersects[0].object.name);
}
}