Javascript 三个骰子，如何在脸上画数字

我刚刚向自己介绍了WebGL和Threejs，作为开始，我正在尝试创建一个3D骰子。我已经创建了立方体，但我真的不知道如何在立方体的面上画数字，我能找到的只是如何改变颜色。我查阅了资料包中给出的示例，但我似乎也没有找到任何面上有文字的示例。这是我的密码

container = document.body;

renderer = new THREE.CanvasRenderer();
renderer.setClearColor( 0xf0f0f0 );
renderer.setSize( window.innerWidth, window.innerHeight );

container.appendChild( renderer.domElement );

camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 1000 );
camera.position.y = 150;
camera.position.z = 500;

scene = new THREE.Scene();

geometry = new THREE.CubeGeometry(200,200,200);

cube = new THREE.Mesh(geometry);

scene.add( cube )
cube.rotation.x = 0.01;
renderer.render( scene, camera );

---

我已经记录了

几何体

，它有一个属性

面

，但它只有颜色：//

通常，三个网格构造函数如下所示：

           Mesh( geometry, material )

使用材质材质作为构造器的第二个参数，以便能够为骰子使用纹理。我认为会有一个问题，因为立方体的侧面不是唯一的UV贴图，因此如果在这样的立方体上使用纹理，每个面都将显示整个纹理。您必须重新计算每个面的UV贴图并设置适当的纹理，或者我认为更简单的方法是使用DCC应用程序创建具有唯一贴图面的立方体，然后将自定义纹理用于骰子。我想开始吧，试试Blender，因为它是我认为最好的开源DCC应用。

---

另一个解决方案是在互联网上找到一个带有纹理的模型，并用它来显示骰子

通常，三网格构造函数如下所示：

           Mesh( geometry, material )

使用材质材质作为构造器的第二个参数，以便能够为骰子使用纹理。我认为会有一个问题，因为立方体的侧面不是唯一的UV贴图，因此如果在这样的立方体上使用纹理，每个面都将显示整个纹理。您必须重新计算每个面的UV贴图并设置适当的纹理，或者我认为更简单的方法是使用DCC应用程序创建具有唯一贴图面的立方体，然后将自定义纹理用于骰子。我想开始吧，试试Blender，因为它是我认为最好的开源DCC应用。 另一个解决方案是在互联网上找到一个带有纹理的模型，并用它来显示骰子

看一看

请注意您使用的three.js的版本。

请查看

---

请注意您使用的three.js版本。

嘿，谢谢您的建议。然而，你能看一下这个吗？它似乎使用了threejs:/这并不是真的要找到更简单的方法来做，而是因为它给了我一段艰难的时间，你知道：D我也找不到通过threejs文档的方法..嘿，谢谢你的建议。然而，你能看看这个吗？它似乎使用了threejs:/这并不是真的要找到更简单的方法来做，而是因为它给了我一段艰难的时间，你知道：D我也找不到通过threejs文档的方法。。