How to make all the postions of the cube start from 0 0 0 rather than center of cube

Questions
1

Hi,
I want to place certain cubes at defined locations
eg cube 1 (0,0,0)
cube 2 (10,0,0)

but when i created the cube the cube is not placed at the corner rather at the center of the axis.
is there any way to place the cube at the correct position.
i have a tooltip and need to display correct positions
hence want the cubes to start from the corner of the axis and not the center .

image
image777×392 21.1 KB

this is the current view.

i want it to look like
image

can someone help me out with this issue

2

You can do this by translating the geometry via BufferGeometry().

https://jsfiddle.net/Ljrzn7fg/1/

The demo changes the origin of the box to one of the corner points.

3

Thanks
I have tried this method still facing the same issue
image
is there any other alternative way

4

on the mesh call the position like cube.position.set(x,y,z)

5

I’m afraid this won’t solve the problem. The OP wants to offset the geometry’s origin.

6

Do you create a new geometry for each box? You should only use one box geometry in a 1 unit size, offset it by half like your first cube and then scale the mesh of it for different sizes. If you need a geometry for each box offset the geometry by half of the size in each axis.

7

Hi Fyrestar,

Thats exacty what i was doing
var positiony = posY + 0.1 + ( height / 2 );
var positionx = posX + 0.1 + ( length / 2 );
var positionZ = posZ + 0.1 + ( width / 2 );

but this method just didnt seem correct for me.
was trying to fetch an appropriate way.couldn’t find one

9

Hi, i was following this thread, and i have been trying to achieve kind of the same goal but unfortunately did not succeed. I am new to threejs and i have been trying to make a 3D cube , by assigning it to a point having x,y,z co-ordinates on a cartesian plane.
also, cube.position.set(x,y,z) did not work for me. :confused:

10

in my senario if i have to place the box assume at position(0,0,0)
then all i did was
createcontainer(0,0,0,4,1,4,001);

function createcontainer( posX, posY, posZ, length, height, width ,binname) {

// Create the container.

var geometry = new THREE.BoxGeometry( width, height, length );

var material = new THREE.MeshBasicMaterial( { color: ‘green’} );

container = new THREE.Mesh( geometry, material );
container.name = binname;
scene.add( container );
objects.push( container );
container.position.x = (width/2) + parseInt(posZ);
container.position.y = (height / 2) + 0.1;
container.position.z = (length/2)+ parseInt(posX) ;
}

1 Like
11

Have u tried to adjust the camera perspect or distance?

12

Yes it works easy that way. @ThreejsNewbie. Thanks! my coordinates were reversed actually. I went ahead and also created a matrix of cubes.

here i assigned it to co-ordinates from the cartesian plane, i intend to take the co-ordinates of a point from the user , which has a separate function. i hope it makes sense.

var geometry = new THREE.BoxGeometry(h, d, w)
var material = new THREE.MeshPhongMaterial({ color: 0x0000ff })
var cube = new THREE.Mesh(geometry, material)
cube.position.set(x, z, -y)
cube.material.opacity = 0

  scene.add(cube)
  var temp = {}
  temp.originX = x
  temp.originY = z
  temp.originZ = -y