Click event on object

Guys, really need help. How to add click event on planets in this project.

1 Like

@Hidrigar Have you tried adding raycasting? You can add a raycaster, listen for the mousedown event, and when that event triggers, check to see if the user’s mouse position intersects one of your objects:

1 Like

@Hidrigar, try this code

  renderer.domElement.addEventListener("click", onclick, true);
  var selectedObject;
  var raycaster = new THREE.Raycaster();
 // function onclick(event) {
  var mouse = new THREE.Vector2();
  raycaster.setFromCamera(mouse, camera);
  var intersects = raycaster.intersectObjects(planets, true); //array
 if (intersects.length > 0) {
 selectedObject = intersects[0];
1 Like

Your code will find intersection with objects at the center of a screen only, as mouse variable always has values {x: 0, y: 0}. But it will be later. In ther first place, there will be an error message ReferenceError: onclick is not defined.

@prisoner849 , in my project working fine

This is very enigmatic :smile:


I don’t know what magic your project contains @sandipnd31, but I’m intrigued to learn more about it. :stuck_out_tongue:

@Harold do u wanna see my magic, we will connect on team viewer

FPS controls, perhaps?

you might need this:

mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;