Question

我正在开发一个小型行星系统，其中我在枢轴星周围添加了一些旋转和旋转的行星。

这是执行上述操作的代码：

  var mercury = createMesh(new THREE.SphereGeometry(5.0, 10, 10, 0, Math.PI * 2, 0, Math.PI * 2), "mercury.png");
        mercury.position.x = 4;
        scene.add(mercury);
            var speed = 100;
            var distance = 2;
            mercury.position.x = Math.sin(step * speed) * distance*5;
            mercury.position.y = Math.cos(step * speed) * distance;
            mercury.position.z = Math.cos(step * speed) * distance * 5;

现在我想为每个移动的行星添加一个圆圈，它将显示围绕枢轴行星的卫星轨迹，并在行星顶部添加一个标签，就像一个＆＃34;水银＆＃34;在我的情况下，在上述星球上的标签。我该怎么做？

Answer 1

轨道路径

您可以通过几种不同的方式渲染圆圈。您可以使用Three.js lines，例如this example。

或者您可以渲染a torus来标记路径。

文本

您可以创建更多几何图形作为文本as in this example。

或者你可以使用带有文字的精灵，在this SO Question中讨论过。

模式

请注意，您再次对行星进行了硬编码，例如your previous question。我建议你通过创建一个为你构建three.js对象的函数来干掉你的代码。带有签名的东西，例如：

function createPlanetParent(planetName,planetDiameter,planetRadius,...) {...}

通过这种方式，您可以从视图代码中分离出您的数据（行星信息）（three.js几何和枢轴）。

在Three.js中添加oribit圈和标签

1 个答案:

轨道路径

文本

模式