# Move a object by user only in direction

hi

i am using dragcontrols , i want the user be able to move the picture along and wall,
how can i limit the user to only move the to the direction in the photo i add? thanks

I had a similar problem here Drag object along paths

You can use the Line3 to make a line from corner to corner of each wall and then get the closestPointToPoint and set your obj to it. Make sure to use clamping = true

``````this.line = new THREE.Line3(startVec3, endVec3)

public move(moveTo: THREE.Vector3) {

this.line.closestPointToPoint(moveTo, true, moveTo)

// To limit movement only in x or z axes
this.obj.position.x = moveTo.x
this.obj.position.z = moveTo.z
}``````
1 Like

thanks!!!

one last question how do i get startVec3 and endVec3 of object ?

That depends on how you build your scene. Did you create each wall or is it one big model? Basicly you need to get the positions and the lengths of your walls and calculate their corner positions.
If you have the wall as obj, you can compute the BoundingBox of the wall to get the dimensions.

Having a Object3D you do as follow

``````let bbox = new THREE.Box3().setFromObject(wallMesh)
let dimension = new THREE.Vector3()
bbox.getSize(dimension)
``````

Having a Mesh with geometry, you can do

`````` mesh.geometry.computeBoundingBox()
``````

If your pivot point is in the middle of your wall, you can calculate the corners like so

``````corner1 = new THREE.Vector3(
wallMesh.position.x + (dimension.x / 2),
wallmesh.position.y - (dimension.y / 2),
wallMesh.position.z + (dimension.z / 2)
)

corner2 = new THREE.Vector3(
wallMesh.position.x - (dimension.x / 2),
wallmesh.position.y - (dimension.y / 2),
wallMesh.position.z + (dimension.z / 2)
)``````

thanks.

i figure out how to calculate my wall corners .
still trying to figure this.line.closestPointToPoint(moveTo, true, moveTo)
the first moveto is the first corner and second moveto is the second corner
how do i pass the position of the object that i am moving, in my case the image

thanks a lot for you help

Btw you can add custom start & end points yourself in 3D software. For example in Blender you could parent `empty` objects to the wall/building and when using GLTF Exporter (2.8+) they will be exported as children `Object3D` with positions, ready to be used in your app Hey, when instancing a line object` let line = new THREE.Line3(startVec, endVec);` you define a route. The length of the line from point A to B. Now when using the `line.closestPointToPoint()` function, you are saying: I have a point(V)! Give me the nearest point ON the line, that is closest to the point(V).

The documentation states: .closestPointToPoint ( point : Vector3, clampToLine : Boolean, target : Vector3 ) : Vector3

The first parameter is the pointV (Your obj (painting) position on the wall)
The second parameter is a boolean for clamping it ( Set it to true! )
The third parameter is the target vector3 where the result is stored ( basicly the return value )