1
\$\begingroup\$

I'm trying to build 3D solar system with webGL. I have all the stars moving in a circle around the sun as sholud be, and I want them also to spin around their own Y axis.

How can I add it?
I tried :

mat4.rotate(mvMatrix, degToRad(starsList[i].Yangle), [1, 0, 0]);

but I got wierd result.
any help?

mat4.identity(mvMatrix);
mat4.translate(mvMatrix, [0, 0, -30]);

for (i = 0; i < starsList.length; i++) {  
    mvPushMatrix();
    mat4.rotate(mvMatrix, degToRad(starsList[i].angle), [0, 1, 0]);
    mat4.rotate(mvMatrix, degToRad(starsList[i].Yangle), [1, 0, 0]);

    mat4.translate(mvMatrix, starsList[i].initPlace);
    mvPopMatrix(); 
 }


var lastTime = 0;

function animate() {
    var timeNow = new Date().getTime();
    if (lastTime != 0) {
        var elapsed = timeNow - lastTime;
        for (i = 0; i < starsList.length; i++) { 
            starsList[i].angle += starsList[i].speed * elapsed;
            starsList[i].Yangle += starsList[i].speed * elapsed;

        }
    }
    lastTime = timeNow;
}
\$\endgroup\$
  • 2
    \$\begingroup\$ Rotate them before you apply the transformations \$\endgroup\$ – Bálint Oct 2 '16 at 9:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.