# Three Points Interaction

**URL:** <https://discourse.threejs.org/t/three-points-interaction/3045>\
**Category:** Questions\
**Tags:** points, animation\
**Created:** [June 6, 2018, 4:50pm UTC](https://discourse.threejs.org/t/three-points-interaction/3045 "2018-06-06T16:50:37Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![jcalmeidajr](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/jcalmeidajr/32/1978_2.png) [@jcalmeidajr](https://discourse.threejs.org/u/jcalmeidajr)\
**Post date:** [June 6, 2018, 4:50pm UTC](https://discourse.threejs.org/t/three-points-interaction/3045/1 "2018-06-06T16:50:37Z")

</div>

Hi, I’m quite new in Three.js and I’m having some troubles.  
I uploaded a experiment that I’m working on here: [https://codepen.io/jcalmeidajr/pen/OEXegL](https://codepen.io/jcalmeidajr/pen/OEXegL)  
The first thing that I cannot figure out is how to get the intersect object and its position. Now, the intersects[i].object.position variable is always returning {x:0, y:0, z:0}. What I would like is to move the points based on the mouse position. Also, how could I increase the area of intersection? I’d like to get not only the point positioned exactly in the mouse position, but also some points around that. Now I’m getting the intersect object’s index and multiplicate by 3, so I get its position on the array of 3 coordinates.  
The last thing would be the animation, is it possible to add some ease? Using TweenMax or something like this?

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [June 6, 2018, 7:04pm UTC](https://discourse.threejs.org/t/three-points-interaction/3045/2 "2018-06-06T19:04:50Z")

</div>

> [@jcalmeidajr](#):
>
> Now, the intersects[i].object.position variable is always returning {x:0, y:0, z:0}.

That’s because `intersects[i].object` is always the instance of `THREE.Points`.

> [@jcalmeidajr](#):
>
> Also, how could I increase the area of intersection?

You can use `raycaster.params.Points.threshold` for this (see [docs](https://threejs.org/docs/index.html#api/core/Raycaster.params)). The units of `threshold` are in `world units`.

> [@jcalmeidajr](#):
>
> Using TweenMax or something like this?

Yes. You need to animate the specific position data of the respective points in your `position` attribute.
