Hi,
I’m trying to update the dimensions of the box when it is clicked.
The dimensions of the box are getting updated as expected but he helper is still at the same position.
Can some suggest me how to resolve this issue
I created the box using below code
function createcontainer( posX, posY, posZ, length, height, width ,binname) {
// Create the container.
width = Scalingvalue * width;
height = Scalingvalue * height;
length = Scalingvalue * length;
var geometry = new THREE.BoxGeometry( width, height, length );
var material = new THREE.MeshBasicMaterial( { color: 'green'} );
container = new THREE.Mesh( geometry, material );
outlineContainer = new THREE.BoxHelper( container, '#3E424B' );
container.name = binname;
container.add( outlineContainer );
scene.add( container );
tooltipEnabledObjects.push(container);
objects.push( container );
collisions.push(container);
validatearrayfornewbin.push(container); /* new_bin*/
container.position.x = (width/2) + parseInt(Scalingvalue*posZ);
container.position.y = ( height / 2) + 0.1;
container.position.z = (length/2)+ parseInt(Scalingvalue*posX) ;
container.userData.currentPosition = new THREE.Vector3();
}
The box geometry is updated using below code:
raycaster.setFromCamera(mouse, camera);
// console.log('new' + tooltipEnabledObjects[0]);
var intersects = raycaster.intersectObjects(collisions);
// console.log('window2 ' + window.location.href);
if (intersects.length > 0) {
var item = intersects[0];
var objectHit = item.object;
var objectHitname = item.object.name;
controls.enabled = true;
var geometry = new THREE.BoxGeometry( item.object.geometry.parameters.depth,
item.object.geometry.parameters.height, item.object.geometry.parameters.width );
item.object.geometry = geometry;
var knotBBox = new THREE.BoxHelper(item.object, '#3E424B');
knotBBox.update();
}
but boxhelper is not getting updated
Only your initial helper is added to the container, the one created later isn’t. You re-create your geometry and helper each time, you can just update them.
Can you please demonstrate the issue with this live example? https://jsfiddle.net/tfwy4bk3/
As you can see in the fiddle, updating the box helper works just fine. It’s also not necessary to create a new box helper on each update.
Hi,
I could not create a fiddle becoz there were other files also attached to this
I have attached the zip file which contains the codewarehouse.zip (264.2 KB)
initially on running the index file we get this screen
on click of rotate and later when we clicl on box we can change the x-y position
but the helper still remains in same position
i mean i have certain other js files which i’m refering.but if u run the zip file you would be able to see the model once you run the index in our local
There is nothing happening when i click on rotate. Did you tried reusing the old box helper instead creating a new you don’t add to the scene hierarchy?
After clicking on rotate we need to click the box
How to reuse th old box helper
Hi Fyrestar,
did you mean using Boxhelper.update();
That didnt work
Reusing your initial BoxHelper you added to the scene hierarchy here:
could you please explain me how .
i tried using item.object.add( outlineContainer );
inside the function
function doMouseDown(x,y) {
// mouse = new THREE.Vector3();
raycaster.setFromCamera(mouse, camera);
// console.log('new' + tooltipEnabledObjects[0]);
var intersects = raycaster.intersectObjects(collisions);
// console.log('window2 ' + window.location.href);
if (intersects.length > 0) {
var item = intersects[0];
// alert('item' + item);
var objectHit = item.object;
var objectHitname = item.object.name;
controls.enabled = true;
//alert('item.object.depth' + item.object.geometry.parameters.width);
var geometry = new THREE.BoxGeometry( item.object.geometry.parameters.depth,
item.object.geometry.parameters.height, item.object.geometry.parameters.width );
item.object.geometry = geometry;
item.object.add( outlineContainer );
}
animate();
return false;
}
this function is used for switching the lenght and width when i click on rotate and then click on box
Hi Michael,
I have attached the Zip file below.on click of rotate and later when i click on the box the box width and depth is switched.but the helper is not updated
could you please suggest something
In your code you call BoxHelper.update(), what throws an error as your box helper is called outlineContainer.
no I’ve used
outlineContainer.update();
i get a warning three.js:47255 THREE.BoxHelper: .update() has no longer arguments.
This was the code in your zip:
function doMouseDown(x,y) {
// mouse = new THREE.Vector3();
raycaster.setFromCamera(mouse, camera);
// console.log('new' + tooltipEnabledObjects[0]);
var intersects = raycaster.intersectObjects(collisions);
// console.log('window2 ' + window.location.href);
if (intersects.length > 0) {
var item = intersects[0];
// alert('item' + item);
var objectHit = item.object;
var objectHitname = item.object.name;
controls.enabled = true;
//alert('item.object.depth' + item.object.geometry.parameters.width);
var geometry = new THREE.BoxGeometry( item.object.geometry.parameters.depth, item.object.geometry.parameters.height, item.object.geometry.parameters.width );
item.object.geometry = geometry;
BoxHelper.update();
}
Hi,
i tried using BoxHelper.update(); didnt work
later i even tried using outlineContainer.update();
didn’t work
warehouse.zip (256.5 KB)
It does, but you should add your box helper to the scene, not the object you want the box helper for.
2 Likes
Hi Fyrestar,
Thanks a lot 
I totally missed scene.add( outlineContainer );
hi Fyrestar,
The helper issue is resolve but when i try to drag the box the helper does not come along.i tried adding outlineContainer.update(); inside the dragcontrols function but still there is a slight lag
warehouse.zip (264.2 KB)
could you help me with this
