Question

我必须用three.js创建一个小型太阳系（1颗星，2颗行星，每颗行星1颗轨道）这是我第一次使用three.js（以及一般的JavaScript）编程，所以我是一个完整的新手。

我设法建立了我的静态系统，以便拥有太阳，火星，火卫一，地球和月球。

现在我不知道如何让行星绕太阳运行，卫星绕行星运行。

这是我到目前为止所做的事情

     //global variables declaration
  function init(){
     /*starting code: cameras, declaring variables and so on*/
    function celestialBodiesSetup(){
        var geometry,material,image;
        var celestialBodies=[sun,mars,phobos,earth,moon];
        //sun, mars etc are declared as global variables before the init function
        for(var i=0;i<celestialBodies.length;i++){
            switch (celestialBodies[i]){
                case sun:
                    material=new THREE.MeshPhongMaterial();
                    geometry =new THREE.SphereGeometry(35,32,32);
                    image="mysun.png";
                    sun=createSphere(geometry,material,image);
                    sun.position.set(0,0,20);
                    var pointLight = new THREE.PointLight( 0xFDFDFD, 2, 1800,70 );
                    sun.add(pointLight);
                    break;
                case mars:
                    material=new THREE.MeshPhongMaterial();
                    geometry =new THREE.SphereGeometry(17,32,32);
                    image="mars.jpg";
                    mars=createSphere(geometry,material,image,sun);
                    mars.position.set(150,-15,0);
                    break;
             /*repeat process for the remaining celestial bodies*/
       function createSphere(geometry,material,image,celBody){
        var sphere = new THREE.Mesh(geometry, material);
        material.map= THREE.ImageUtils.loadTexture(image);
        if(celBody) celBody.add(sphere); /*I set that all the planets are added to the sun, and all 
           the moons are added to their planet. Only the sun is added to the scene itself*/
        else scene.add(sphere);
        return sphere;
    }
   celestialBodiesSetup();   
}

此时我必须处理animate（）函数，但我对矢量，旋转等没有任何线索。

我唯一能做的就是设置像earth.rotation.y + = 0.1之类的东西，这样行星开始在它的轴上旋转，但就是这样。

Answer 1

你为什么不试试

http://www.html5rocks.com/en/tutorials/casestudies/100000stars/

案例研究，这是好的加上

上有很多例子

https://www.chromeexperiments.com/?q=solar%20

为了很好地参考threejs库启动器继续进行示例可视化

http://stemkoski.github.io/Three.js/

http://mrdoob.github.io/three.js/examples/canvas_geometry_earth.html

http://oos.moxiecode.com/blog/index.php/experiments/javascript-webgl/

在库接口的抽象级别，这些教程可以帮助您创建项目。您需要花时间在旋转矢量，四元数和着色器上进行深入研究。

你也可以查看统一的3d引擎，为你的东西建立一个快速的夜间原型，以获得演示的东西。

Answer 2

我做了类似的事情并用以下内容完成了旋转和轨道运行：

asyncio.Task.current_task().foo = "Bar"
asyncio.Task.current_task().name = "#{}".format(n)

简单的太阳能系统有三个.js

2 个答案: