I'm very stuck and would love some advise

I’m new to three.JS and LOVE what you guys are doing here. I’ve had a lot of fun learning over the last few weeks but i’ve hit an issue with my 3D model, which could just be the models themselves, i’m not sure.

So here is the idea. I have a 2D map, user drags and drops attractions onto the map, three.JS uses actual magic to render it into 3D in my browser… BUT the placement seems wacky on these models supplied by a 3rd party. Some faced the wrong way (fixed this in Photoshop) some were way too big (also mostly fixed), finally the real issue. Some of them appear to be way off center of where they are rendered. So then I looked into THREE.BoxHelper() to see if I could force these models to a 2D center point, the results were even more worrying. The 3D models appear to be rendering outside of the BoxHelpers and it gets consecutively worse, each of these are 200 (is it pixels, whatever you use for measurement) apart, here is a pic: https://drive.google.com/file/d/1HvNJy0mrsDQ_87Fm62NA9psqXpYj4xOg/view?usp=sharing

What am I doing wrong because i know it is not your amazing software. Any help could save my week and possibly career, thanks! I looked into geometry.centre() but when i log my object I have no geometry from the data model so it just returns and error.

Perhaps doing a model.updateMatrix()? Without seeing your code or a fiddle it is difficult to say.

BTW it is geometry.center(), not “centre()”, if that helps.

1 Like

ok i’ll fiddle it, asap thanks, i’ll run that updateMatrix function and report back too. Sorry I’m a little worried to show code for a work client online and also a little worried that this part of the project is sloppy due to my lack of experience with threeJS. Sorry my wife wants me to spend some quality time tonight or i’d do this right now. Thanks so much for your reply. Needless to say I am inspired by threeJS and would love to become a more active member of the community.

1 Like

Hey so for anyone else reading this, always apply your THREE.BoxHelper() to your object before you set the position of your object, this seemed to fix my issue. Thanks for the replay amigo

It should also work to call BoxHelper.update() when the transformation of your object has changed.

1 Like

Thanks. I have a lot to learn for sure, but i’m really loving threeJS

2 Likes