Smooth Follow On Collision

I’m trying to create a script that I can apply to a game object in which whenever the draggable object comes into contact with the target object, it will initiate ‘smooth follow’ and stay alongside the target object. I’ve attempted to get this to work to no avail. Any ideas?

Original Post on Discord

by user 962902844049096704

Hey :wave: You could put a trigger volume as a children:
You would need to add a component to every potential object that could smooth follow. How many objects is that in your usecase?

maybe 10-12 objects

by user 962902844049096704

I think that is an ok amount :+1:

What have you tried so far btw?

I applied smooth follow and set the target to the object in question, but the problem is, all of these objects merge to center, creating unwanted effects.

by user 962902844049096704

What I really want is for the draggable object to come in contact with the other draggable object (the target object) and remain in the position it was in once it intersected with the target object, and follow along the target object when the target object is dragged elsewhere.

by user 962902844049096704

So, that would mean the goal of the smooth follow should be the position of the object when it first got in contact with the draggable?

YES! Exactly.

by user 962902844049096704

You can create objects dynamically.

import { Object3D } from "three";

const goalObj= new Object3D();

Then you need to set the parent otherwise the object is not a part of any hiearchy (afaik).


Then you can set the position of the interacted object to our new goalObj and se that goalObj as the target for the smooth follow.

Is that something that would work in your case? What code do you have so far?

Let me know if you get stuck or anything wouldn’t be clear :slight_smile:

Hey sorry, I got signed out of discord :frowning_with_open_mouth: - I’ll try your approach and report back. Thanks for the help!

by user 962902844049096704

@kipash :cactus: I found another approach that worked for my use case:

by user 962902844049096704

Hey @sensorsovercensors when you surround your code with ``` it’s better readable in discord :slight_smile: ideally with ```ts to get syntax highlighting

Hey sorry about that !

by user 962902844049096704

No problem :slightly_smiling_face: ts must be in the same line as the backticks (exaclty like this ```ts for highlighting)

Like so

 import { Behaviour, Collision } from "@needle-tools/engine";
import { DragControls } from "@needle-tools/engine"; // Import the DragControls class

export class FollowRedSphere extends Behaviour {
  private redSphere: any = null; // Reference to the red sphere
  private offset: THREE.Vector3 | null = null; // Offset between the object and the red sphere

  onCollisionEnter(col: Collision) {
    // Check if the collided object's name is "RedSphere" and if the object is not already connected
    if ( === "RedSphere" && this.offset === null) {
      // Log the collision event, including the name of the object that collided
      console.log(`Object "${}" collided with the red sphere.`);

      // Get the DragControls component and disable it
      const dragControls = this.gameObject.getComponent(DragControls);
      if (dragControls) {
        dragControls.enabled = false;

      // Store a reference to the red sphere
      this.redSphere = col.gameObject;

      // Calculate and store the offset between the object and the red sphere
      this.offset = this.gameObject.position.clone().sub(this.redSphere.position);

  update() {
    // If connected to the red sphere, update the position to follow the red sphere
    if (this.offset && this.redSphere) {
      // Calculate the new position based on the red sphere's position and the stored offset
      const newPosition = this.redSphere.position.clone().add(this.offset);

      // Set the new position

by user 962902844049096704