Imported scene in Aframe with gltf-part resets object origins to 0,0,0

Viewed 335

Problem: The origins of objects used with gltf-part are at 0,0,0

codesandbox example: https://codesandbox.io/s/xenodochial-moore-4383f?file=/index.html

shows a log with the correct positions when displayed as a scene and one where I use gltf-part to show the cubes where all positions of the cubes are at 0,0,0

The exported scene is from blender, in which I set the origin to the center of each cube, see the top right cube.

After importing the gltf file in Aframe, and showing the cubes with gltf-part, every cube has as origin 0,0,0.

The GLTF is correct, when I import it again in blender, the origins are still at the center of the cube.

Blender file origin of top right cube is in center, even after export to gltf and imported again Aframes inspector shows origin of all cubes and selected top right cube is 0,0,0

How can I get the correct coordinates of each cube in Aframe if they are all at position 0,0,0 ?

2 Answers

This works for me:

  window.addEventListener("model-loaded", (e) => {
    const sceneObj = document.querySelector("a-scene").object3D;
    let object;
    object = sceneObj.getObjectByProperty("name", "cube1");
    console.log(object.position);
    object = sceneObj.getObjectByProperty("name", "cube2");
    console.log(object.position);
  });

The component is behaving as expected, the parts are selected but you're still loading them as a child in your scene so their relative positions are retained at 0,0,0 for the parent element.

Here is a rough outline of how to change this behavior to meet your needs:

  • You will need to edit the gltf-part component to "reset" the position of the "part" that it extracts when it is loaded. After the mesh is cloned in this line: mesh = part.getObjectByProperty('type', 'Mesh').clone(true); then you'll want to copy the position of that mesh to a variable and then also reset the mesh locally: mesh.position.set ( 0, 0, 0 );
  • Then you'll want to set the A-Frame entity to the position that you've just saved in the variable.

Here is example code with a modified component: https://codesandbox.io/s/gltf-part-reset-qgovf note the renamed component to gltf-part-reset and the new attribute resetPosition. The default is false to retain existing gltf-part behavior, set to true in this example to exhibit desired behavior.

Related