three.js 导入mtl obj文件,纹理贴图未显示指南

最近公司有个需求，需要做个3d人体图提供部位点选，于是很自然的找到了设计师妹子，，一个obj mtl文件甩了过来，

很自然的使用了 mtlLoader ，然而事情没那么简单。。。。

先上mtlLoader objLoader代码

                mtlLoader.setPath( 'obj/' );
                mtlLoader.load( 'rr.mtl', function( materials ) {
                        materials.preload();
                        var objLoader = new THREE.OBJLoader();
                        objLoader.setMaterials( materials );
                        objLoader.setPath( 'obj/' );
                        objLoader.load( 'rr.obj', function ( object ) {
                            scene.add( object );
                            animate();
                        });
                } );

上面代码是材质文件mtl配合模型文件obj的使用方法，如果发生报错多半是mtlLoader或者Objloader或者Three.js版本问题，，一定找到正确的版本

我的项目中，一切正常没有报错然而纹理贴图没有生效，，，textarea image属性为null，，图片数据消失了，
于是打开mtl文件

three.png

下面的贴图文件路径为设计师本地文件路径，，所以没生效，于是改成本地路径，然而还没生效，
node 起个静态资源服务，通过http方式访问图片，还是没生效....
最后把tgp格式图片改成了jpg。。。。。成功出现贴图，，
http方式访问，，支持的图片类型文档中有写

png.png

这个坑可能不太好发现，主要是不报错，其他坑我就不赘述了。。。最后需求成功完成，上图。。。。

body.png