2

我正在尝试解构这个使用 ThreeExtras.js 的 webGL moon 。

Threeextras.js 似乎是 Three.js 的一些变体，加上 repo 中其他地方的一些片段；是否有任何文档，或描述它与标准 Three.js 有何不同？

（我还发现了一个变体构建存储库，但除了three.js 存储库之外没有文档或提及来源。） http://www.chandlerprall.com/threebuilds/

4

3 回答 3

2

ThreeExtras.js 在 r49 之前一直存在于存储库中。你可以在https://github.com/mrdoob/three.js/tree/r49查看它。在那之后，事情发生了变化。您必须查看migration guidehttps://github.com/mrdoob/three.js/wiki/Migration和https://github.com/mrdoob/three.js以changes log了解如何将代码带到最新版本或询问有关特定问题的问题。

于 2013-05-28T15:30:34.013 回答
1

如果您希望在 WebGL 月球演示中解构基于纹理的效果，这里有一些信息：在最近的 Three.js 版本中，一些纹理效果（例如凹凸贴图和镜面贴图）被合并到 THREE 中.MeshPhong材料。有关一组类似效果的示例（例如，对于地球），请查看以下示例：

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

特别相关的代码是：

// Create the Earth with nice texturing - normal map for elevation, specular highlights
var sphereGeo = new THREE.SphereGeometry(100, 64, 32);  

var colors = THREE.ImageUtils.loadTexture( "images/earth-day.jpg" );
var bumps  = THREE.ImageUtils.loadTexture( "images/earth-topo.jpg" );
var shine  = THREE.ImageUtils.loadTexture( "images/earth-specular.jpg" );

var earthMaterial = new THREE.MeshPhongMaterial( { color: 0xffffff, map: colors, 
    bumpMap: bumps, bumpScale: 4, specular: 0xffffff, specularMap: shine, emissive: 0x888888 } );

var earthSphere = new THREE.Mesh( sphereGeo, earthMaterial ); 
scene.add(earthSphere);

希望这可以帮助！

于 2013-05-30T04:22:46.120 回答
1

我看到了同样的 WebGL 月球演示，并决定看看我是否可以做得更好。如果您想了解如何使用最新版本的 Three.JS 做类似的事情，您可以查看我的Moon Demo。在存储库页面上发布了一个链接到的博客，但它正在进行中。如果您不介意深入研究代码，那么您可能会比您现在正在查看的演示更好地使用它。如果您想查看，这里是现场演示。它实现了漫反射照明和法线贴图。然而，没有应用镜面光照。

于 2013-06-01T23:04:22.293 回答