Limit Movement DragControls

Questions
1

Hi there, I made a collision system, the scene actually contains 4 walls and the object is supposed to stay inside the 4 walls, I have made the walls collide-able so that the objects collide and don’t go out of the room. But when the objects collide they stay there only if the pointer is within the walls, if the pointer moves out the object jumps on the other side. Here’s a glitch link to get better understanding.

If anyone can help regarding this I’ll be thankful!

2

If it is always 4 walls framing a rectangle, the easiest way is just to check the min/max coordinates of the dragged object, there is no need to intersect with walls. This is, instead of forbidden places, use the opposite – allowed places. In this case the allowed places is just a rectangle (or a square).

A more complex solution is to cast a ray from the current position to the new position. If this ray intersects a wall, then do not move the object.

Another approach is to move the object smoothly, so when the pointer is outside the room, the object will slide towards the pointer, but will hit the wall without overjumping it.

1 Like
3

Well I thought to create the box to have a min / max position but the issue is that I want to create more walls that are also diagonal in rotation. So I can’t apply the min / max limit on that.

The raycast solution seems a bit legit do you have an example that I can take the reference from? Or you can provide me some suggestion regarding this.

Also can you explain how can I do the third step, I am kinda confuse on that one but I got the logic you shared.

Thanks for the reply though, really appreciate it.

4

I think you should first have to reconsider your current approach. Using bounding boxes may not work well (or at all) with diagonal walls. It doesn’t make sense to complete the current approach, if you have to abandon it completely later on.

For non-rectangular areas you might need some navmesh (navigational mesh).

Could you please share a version that works fine with walls at various angles? This will demonstrate that your current approach has a good potential.

5

Sure! I’ll tag you once I have done creating a collision that works with rotated walls. I think the idea of detecting collision using raycaster is much better.

6

@PavelBoytchev So I ended up having this code to check for collision, to be honest it is working but in a really weird way:

dragcontrols.addEventListener('drag', (event) => {
  const box1Mesh = event.object;
  box1Mesh.position.y = 0;
  direction.subVectors(box1Mesh.position, lastSafePosition).normalize()
  origin.copy(box1Mesh.position);
  raycaster.set(origin, direction);
  raycaster.far = direction.length();
  const otherBoxes = [boxMesh2, boxMesh3, boxMesh4, boxMesh5];
  const intersections = raycaster.intersectObjects(otherBoxes);

  if (intersections.length > 0) {
    isColliding = true;
    box1Mesh.position.copy(lastSafePosition);
  } else {
    isColliding = false;
    lastSafePosition.copy(box1Mesh.position);
  }
});

Its making the object to collide with the objects with a gap in between can’t find a specific solution for that (In short I am not good with raycasting) so any help regarding this?

7

So instead of using raycasting or boundingBox I ended up using BVH as per the suggestion of manthrax. Its also accurate and useful because later on I want to check collision between complex geometries. The only issue now I am facing is the collision itself, any example or method you know through which I can perform the collision?

Here’s the glitch to have a better look at where I currently am.

8

@PavelBoytchev here’s the updated code which is also making the draggable object to collide with rotated or any complex geometry:

Glitch :･ﾟ✧

9

I was not able to grasp completely the logic in your code, so I simplified the dragging to fit to my way of thinking.

Is it something like this what you want to achieve (watch the yellow frame)?

The code is here: https://codepen.io/boytchev/full/NWVVvBz. I spent too much time on this. I hope it could at least give you some hints.

To be honest, if I were to drag an object in a room, I’d prefer to use navmeshes.

2 Likes
10

Thanks for this and my apologies for wasting your time and disturbing you, that’s actually what I need. I would have gone with navmesh but I am totally not familiar with how that works, do know any source through which I can learn more about it or can you tell me where did you learn about it?