Menu
I try to write an export of an 3-d plant modelling software to Three.js but got stuck with the rotations and translations of the objects.
So far I tried to use quaternions and transformation matrices but both results are not satisfying. For my tests I use a simple binary tree that originally looks like this:
the results of my export are this:
You can find the code of both export under
http://ufgb966.forst.uni-goettingen.de/three/test2Quaternion.html
http://ufgb966.forst.uni-goettingen.de/three/test2Matrix.html
It seams that my rotations are made around the wrong point. Each rotation should be done around the origin of each geometry. What would be a method to achieve the result I'm looking for?
264
rotation = Math. PI/4; texture. center = new Vector2d(0.5, 0.5); // center of texture. Save this answer.
One way to do is to create a Three. js object representing the orbit an add the circle and the planet to this orbit. This way, you just need to change the rotation of the orbit to make the planet revolving around the sun. var orbit = new THREE.
The way that Three. js structures its rendering means that the learning curve won't be too steep. It organizes all of the renders you'll do, whether 3D or 2D, under a “Scene” container.
Just in case you haven't already, you might want to take a look at this: Using Matrices & Object3Ds in THREE and this How to use matrix for transformation, it helped me out. Also note that three.js uses a right handed coordinate system which you probably know.
If you export from blender, try -Z Forward, Y up.
165
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
