How do I paint a model using Raycasting?

Questions
,
1

Hello, everyone, I have a 3D model to paint. I decided to create a function that sticks colorful spheres on the model by using the intersection method. This is how I decided to paint it with click events.

function getIntersections(event) {
    var vector = new THREE.Vector2();
    vector.set(
      event.clientX / window.innerWidth * 2 - 1,
      -(event.clientY / window.innerHeight) * 2 + 1
    );
    var intersects = raycaster.intersectObjects(scene.children);
    return intersects;
  }

the function basically returns the intersection points then I create a mesh and add it to the scene

function paintOnScene(event){
      var pointer = new THREE.Mesh(
      new THREE.SphereGeometry(0.8, 20, 20),
      new THREE.MeshBasicMaterial({
        color: 0x4b0082,       
      })
    );
    var intersects = getIntersections(event);
    pointer.position.copy(intersects[0].point);
    scene.add(pointer);
  }

However, my problem is I just want my spheres to be added to my 3D model, not on any sphere object.
Actually the screenshot explains better, As I click on any sphere object it adds another sphere on it again but this is not what I want to happen.

var intersects = raycaster.intersectObjects(scene.children);
I think it takes spheres as a child and that is why it adds on it. Is there a way to specify intersection objects? ( Just intersect with my 3D Model)

issue

2

The first argument of raycaster.intersectObjects is precisely the array of objects for which you want to find intersections with the ray. So instead of passing scene.children, which of course includes the new spheres, pass an array with only the objects you want to paint.

1 Like