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

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 .

this is the current view.

i want it to look like

can someone help me out with this issue

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

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

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

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

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

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.

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

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:

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

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 ); = 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

Have u tried to adjust the camera perspect or distance?

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

  var temp = {}
  temp.originX = x
  temp.originY = z
  temp.originZ = -y