如何将图像作为纹理加载到three.js中的层模型答案

【问题标题】：How can I load an image as texture to a ply model in three.js如何将图像作为纹理加载到three.js中的层模型
【发布时间】：2019-09-19 07:32:23
【问题描述】：

我正在尝试展示一个 3d 模型及其各自的纹理，我如何加载层模型的纹理？

这是在一个 html 文件中，我在其中使用 three.js 和 plyloader.js 来加载模型，但是当我尝试使用在文档中找到的方法加载它时，我没有设法正确加载纹理它只将颜色加载到纹理而不是图像。

我正在尝试这个：

 var loader = new THREE.PLYLoader();
            loader.load('head3d.ply', function (geometry) {

                geometry.computeVertexNormals();
                var texture = new THREE.TextureLoader().load('head3d.jpg');
                var material = new THREE.MeshStandardMaterial({ map: texture, flatShading: true });
                var mesh = new THREE.Mesh(geometry, material);

                mesh.position.x = 0;
                mesh.position.y = 0;
                mesh.position.z = 0;
                mesh.scale.multiplyScalar(0.006);

                mesh.castShadow = true;
                mesh.receiveShadow = true;

                scene.add(mesh);

            });

我希望您向我展示加载了纹理的模型，但只向我展示具有主导图像颜色的模型

【问题讨论】：

您能否验证您的几何图形是否具有纹理坐标？您可以通过将geometry.attributes.uv 打印到浏览器控制台来执行此操作。它不应该是undefined。
我已经试过了，它说它没有定义，有人建议放置坐标吗？
动态生成 uv 很困难。也许最好将 PLY 文件导入 Blender，编写纹理坐标，然后执行新的导出。在这种情况下考虑使用glTF（参见threejs.org/docs/index.html#manual/en/introduction/…）。

标签： javascript three.js 3d texture-mapping ply-file-format

【解决方案1】：

使用THREE.MeshNormalMaterial。由于某种原因，它似乎在使用 MeshNormalMaterial 时加载了纹理。

【讨论】：