THREE.JS 纹理贴图路径带有中文无法显示怎么办？求解

THREE.JS 加载FBX模型，纹理贴图路径带有中文无法显示，该怎么处理？

https://www.freesion.com/article/6709351593/
参考了试试呢

• 这篇文章讲的很详细，请看：three.js fbx模型导入后 模型的材质感调整
• 除此之外, 这篇博客: Three.js加载FBX并解析骨骼动画中的 加载FBX并解析骨骼动画 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:
  

• 本文是Three.js电子书的14.4节

  通过Threejs先加载一个.FBX格式的三维模型文件，然后解析该文件中的骨骼动画信息。

  

• 以下回答由chatgpt基于相关博客总结生成:

  由于在加载FBX模型中，纹理贴图路径中含有中文会导致无法显示的问题，可以尝试使用Base64编码的方式将中文路径转换成16进制字符串，然后将转换后的字符串作为纹理贴图的路径。

  具体实现步骤如下：

  1.将纹理贴图路径中的中文进行Base64编码，并转换成16进制字符串：

  var texturePath = "贴图路径";
  var texturePathHex = new Buffer(texturePath).toString('hex');//转换成16进制字符串
  

  2.创建一个TextureLoader对象，并将转换后的路径作为参数加载贴图：

  var textureLoader = new THREE.TextureLoader();
  var texture = textureLoader.load( "data:image/png;base64," + texturePathHex, function ( texture ) {
      //贴图加载完成后的回调函数
  } );
  

  3.将加载的贴图应用到材质中：

  var material = new THREE.MeshPhongMaterial( { map: texture } );
  

  完整代码实现如下：

  //将纹理贴图路径中的中文转换成Base64编码，并转换成16进制字符串
  var texturePath = "贴图路径";
  var texturePathHex = new Buffer(texturePath).toString('hex');//转换成16进制字符串
  
  //创建一个TextureLoader对象，并将转换后的路径作为参数加载贴图
  var textureLoader = new THREE.TextureLoader();
  var texture = textureLoader.load( "data:image/png;base64," + texturePathHex, function ( texture ) {
      //贴图加载完成后的回调函数
      console.log(texture);
  } );
  
  //将加载的贴图应用到材质中
  var material = new THREE.MeshPhongMaterial( { map: texture } );