Question

我有一些顶点和面数据，只是简单的x，y，z坐标像这样：

var vertices = [1,0,1,1,0,0,0,0,0,0,0,1,1,1,1,1,1,0,0,1,1,0,1,0]
var triangles = [0,1,2,2,3,0,4,5,1,1,0,4,6,7,5,5,4,6,3,2,7,7,6,3,7,1,5,7,2,1,4,0,6,0,3,6]

是否可以仅根据这些信息来创建gltf文件？

Answer 1

如果能够在three.js中创建网格或场景，则可以使用THREE.GLTFExporter进行导出。对于复杂的模型，这可能是最简单的纯JavaScript解决方案。

要创建模型而不使用任何较大的JavaScript库，请尝试使用gltf-js-utils，如下所示。这可能会有点困难，并且需要对glTF格式有所了解。

const asset = new GLTFUtils.GLTFAsset();
const scene = new GLTFUtils.Scene();
asset.addScene(scene);

const node = new GLTFUtils.Node();
scene.addNode(node);

const vertices = [];
for (let i = 0; i < vertices.length; i += 3) {
  const vertex = new GLTFUtils.Vertex();
  vertex.x = vertices[i];
  vertex.y = vertices[i + 1];
  vertex.z = vertices[i + 2];
  vertices.push(vertex);
}

const mesh = new GLTFUtils.Mesh();
mesh.material = [new GLTFUtils.Material()];
for (let i = 0; i < triangles.length; i += 3) {
  const v1 = vertices[triangles[i]];
  const v2 = vertices[triangles[i + 1]];
  const v3 = vertices[triangles[i + 2]];
  mesh.addFace(v1, v2, v3, {r: 1, g: 1, b: 1}, 0);
}
node.mesh = mesh;

const object = GLTFUtils.exportGLTF(asset, {
  bufferOutputType: GLTFUtils.BufferOutputType.DataURI,
  imageOutputType: GLTFUtils.BufferOutputType.DataURI,
});

在任何一种情况下，请考虑检查是否已正确创建模型（使用http://github.khronos.org/glTF-Validator/或http://gltf-viewer.donmccurdy.com/），并在工具无法正常工作的情况下向其提交错误。

使用js从头开始创建GLTF文件

1 个答案: