A-frame: How to attach an object to a point on a model (and/or it's bones)

问题

I want to attach an object* to a particular bone, so it moves along with that bone (think putting a hat on a character's head, say). In three.js, I could do something like:

mesh.skeleton.bones[someindex].add(mesh2)

What's the best way to do this in a-frame?

An alternative might be to parent an object to a specific vertex on the model, but I'm not sure how to do that either.

*: By "object", I think I mean "entity with position and rotation" in A-frame terms

回答1:

As far as i know, a-frame has only a small API for working with models build on Three.js loaders. (+ Don McCurdys animation mixer).

The only "A-Frame" touch i can think of here is creating, and accessing the base model. Having:

<a-entity gltf-model="url(model.gltf)" foo>

You can create an a-frame component which will grab the model, and attach the new mesh to the bone:

AFRAME.registerComponent("foo", {
  init:function() {
    let mesh = this.el.getObject3D("mesh")
    // or this.el.components["gltf-model"].model
    let mesh2; // get create the model using any THREE loader
    mesh.skeleton.bones[someindex].add(mesh2)
  }
})

---

I can't think of any major benefit if you create the hat via <a-element gltf-model="url(hat.gltf)"> and try to position and rotate it using setAttribute() on each render loop (in the tick() function).

来源：https://stackoverflow.com/questions/50492696/a-frame-how-to-attach-an-object-to-a-point-on-a-model-and-or-its-bones