在A-Frame场景中，如何使Sketchfab中的模型以正确的尺寸和颜色出现？

Question

我正在尝试使用框架和 gltf/glb 模型做一些非常基本的事情，基本上是想将一些模型放入场景中。

我从 A-Frame 的 "Hello WebVR" 开始，只是尝试从 Sketchfab 添加一个模型，但每次我设法让它工作...:[=13=]

模型很大。就像其“正确”尺寸的 100 倍或 1000 倍。
模型完全黑暗。

我想我缺少一些在场景中设置模型的基本知识。

我怎样才能使模型正确显示，即正确的尺寸和颜色？

这是我的尝试之一：https://glitch.com/edit/#!/spicy-pretty-singer，往回走 (WASD) 很多。

如果不熟悉 Glitch：点击顶部的“Show”可以看到结果，也可以点击“remix”（fork）更改代码。

Sample model from Sketchfab（我试了几次，结果一样）。

谢谢！

Answer 1

1) 尺码

“正确”尺寸是一个相当主观的术语 - 如果您将模型加载到建模软件中，比如说搅拌器，那么您可以查看原始尺寸（如果转换后没有弄乱缩放比例) 尺寸：

它很大 - 大约 250m x 70m x 90m。请记住 - a-frame 1 个单位等于一米。

您可以在 blender (maya) 中更改它，或者只缩放实体：

<a-entity gltf-model="#model" scale="0.01 0.01 0.01"></a-entity>

2) 变暗的纹理

如有疑问，请务必使用 Don McCurdys gltf model viewer! 仔细检查模型。

沙发看起来出奇的好，但有一个问题！

如果编码（模型纹理编码，渲染器输出编码）和灯光与场景匹配，沙发变暗：

如果我将输出编码更改为 sRGB：

看起来已经好多了。输出编码由渲染器设置 colorManagement (source code)

<a-scene renderer="colorManagement: true"> 在查看器中看起来像：

将纹理编码改为 linear 也可以使其更亮。要在 gltf-model 中更改它 - 据我所知 - 需要一些 javascript:

// wait until the model is loaded
entity.addEventListener("model-loaded", e => {
  // grab the mesh
  const mesh = entity.getObject3D("mesh");
  mesh.traverse(node => {
    // grab the material and change the encoding
    if (!node.material) return;
    node.material.map.encoding = THREE.LinearEncoding
  })
})

场景如下：

glitch here

在A-Frame场景中，如何使Sketchfab中的模型以正确的尺寸和颜色出现？

In an A-Frame scene, how to make models from Sketchfab appear with correct size and color?

aframe