1

I have a model which rotates on the X axis, but the center of the rotation is not on the axis itself. The rotation code is pretty simple:

model.current.rotation.x += 0.016; (axis and speed)

but there seems no way to define the actual axis of rotation to ensure the model just rotates around its own center. At the moment it rotates in a big circle!

Any suggestions appreciated.

:-0

2
  • With your code it should rotate on x axis. Maybe the problem is in your model/graphics.Can you share code of your mode. Commented Jul 7, 2020 at 8:19
  • Thanks mate, you are quite right - the pivot point and the point of origin are both in the wrong place in the actual Blender model. I just figure that out - so its nice to have you confirm it. :-) Commented Jul 8, 2020 at 9:09

1 Answer 1

3

your mesh most likely is not centred, meaning the vertices point way out of the models center of mass. you can either fix this in blender, but even threejs has methods (on the geometry) that recalculate the vertices. a cheaper solution would be to render the mesh, take a box3, set it from the object, then get min/max and use it to shift the object by half of it.

Sign up to request clarification or add additional context in comments.

4 Comments

Thanks for this. Your assessment confirms my own of this afternoon. I need to reset the pivot point and the model origin in Blender. I had assumed it would just send the model and rotate on its actual centre... Threejs has some other options - like Matrix for instance. But my App is running with react-three-fiber and almost anything useful in threeJS just doesn't work in that environment. So thanks for letting me know. I had thought that the model itself was causing the problem but you have confirmed it. Hopefully I will be able to fix this in the morning (Sydney time). :-)
If you found this answer helpful. Please up vote it. It can give a little encouragement.
Hi Muhammad You were quite right - there were two issues: the pivot point was not set to the centre of the mesh, and the mesh was not set to world origin (the centre of space) so the model rotated around a wider axis. Easily fixed :-)
how does this work with the <Stage> component? It seems to be auto centered, but the axis is not located in the middle of the model. It rotates correctly if using <OrbitControls> but not with the rotation prop directly

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.