DAE转GLTF后three.js加载模型水平向量失效及光泽异常求助

将.dae文件转成.gltf格式后，用three.js展示时遇到两个问题：

• 模型水平向量异常：加载.gltf后模型显示为垂直拉伸的窄条，缩放后形态仍和原.dae的正常显示差距很大
• 纹理光泽度差异：转换后的模型光泽和原.dae不一致，当前场景仅使用AmbientLight

相关代码 #

加载.dae的代码 #

let loaderDae = new ColladaLoader();

loaderDae.load(`assets/untitled.dae`, (dae: any) => {
   this.buildingModel = dae.scene;
   this.buildingModel.position.multiplyScalar(0);
   this.scene.add(this.buildingModel);
});

（原DAE模型显示正常，建筑模型完整呈现）

加载.gltf的代码 #

let loaderGLTF = new GLTFLoader();
loaderGLTF.load(`assets/untitled.glft`, (glft: any) => {
        this.buildingModel = glft.scene;
        this.buildingModel.position.multiplyScalar(0);
        this.scene.add(this.buildingModel);
});

（转换后的GLTF模型显示为垂直拉伸的窄条，水平方向异常；缩放后模型形态仍与原DAE不符）

当前光照代码 #

let ambColor = new THREE.Color('rgb(118, 240, 147');
this.ambientLight = new THREE.AmbientLight(ambColor);
this.ambientLight.name = 'testname';
this.scene.add(this.ambientLight)

模型水平向量/形态异常问题 #

1. 检查转换工具的轴系与缩放设置
   DAE（Collada）和glTF的默认轴系、单位可能存在差异，转换时确保工具开启“轴系匹配”选项（比如设置Y轴为向上轴），同时检查是否有自动缩放的选项，关闭不合理的缩放转换。
2. 手动修正模型变换
   加载glTF后，手动调整模型的旋转、缩放参数来匹配DAE的显示效果，示例代码：

   // 示例：根据实际情况调整旋转，修正轴向
   this.buildingModel.rotation.set(-Math.PI / 2, 0, 0);
   // 修正缩放比例，还原模型正确尺寸
   this.buildingModel.scale.set(100, 100, 100);
   

3. 换用其他转换方式
   如果转换工具存在兼容性问题，可尝试用Blender打开DAE文件，再导出为glTF格式（导出时注意勾选“保持轴系”“应用变换”选项）；也可以用Three.js的ColladaLoader加载DAE后，直接导出为glTF文件。

纹理光泽度差异问题 #

1. 补充光照类型
   AmbientLight仅提供全局环境光，无法表现材质的高光/光泽。建议添加方向光或点光配合环境光，示例代码：

   // 添加平行光模拟主光源，提升材质光泽表现
   const directionalLight = new THREE.DirectionalLight(0xffffff, 0.8);
   directionalLight.position.set(5, 10, 7.5);
   this.scene.add(directionalLight);
   

2. 手动调整材质参数
   DAE的材质属性（如高光、光泽度）和glTF的PBR材质（金属度、粗糙度）映射规则不同，转换工具可能未正确转换，可手动调整：

   this.buildingModel.traverse((obj) => {
     if (obj.isMesh) {
       // 降低粗糙度、调整金属度，模拟原DAE的光泽效果
       obj.material.roughness = 0.3;
       obj.material.metalness = 0.5;
     }
   });
   

3. 验证纹理完整性
   检查转换后的glTF是否正确关联了纹理文件，确认纹理的格式、通道（如Alpha、光泽通道）未在转换过程中丢失。

内容的提问来源于stack exchange，提问作者Finn