3MF object has infinite bounding box post-loading

I am attempting to load a 3MF file that you can find here: 3mf-samples/examples/beam lattice/pyramid.3mf at 665e20dc4d7777fd4c9702bca86a2d4028440337 · 3MFConsortium/3mf-samples · GitHub

I am doing it on the following codesandbox:

https://codesandbox.io/p/sandbox/model-loading-test-2ynlw9?file=%2Fsrc%2FApp.js%3A25%2C40

With the code below. The issue is that the item is not loading, resulting in an infinite bounding box.

import { Canvas, ambientLight } from "@react-three/fiber";
import { useEffect, useState, useRef } from "react";
import { Object3D, Box3 } from "three";
import { ThreeMFLoader } from "three/examples/jsm/loaders/3MFLoader.js";
import { Stats, OrbitControls } from "@react-three/drei";

function Test() {
  // The file is then passed here
  const [objectMesh, setObjectMesh] = useState(new Object3D());
  useEffect(() => {
    const loader = new ThreeMFLoader();
    loader.load("pyramid.3mf", function (obj) {
      setObjectMesh(obj);
      console.log("Loaded obj");
      console.log(obj);
      let box = new Box3();
      box.setFromObject(obj);
      console.log(box);
    });
  }, []);
  console.log("Rendering");
  return (
    <>
      <OrbitControls />
      <primitive object={objectMesh} />
    </>
  );
}

export default function App() {
  return (
    <div className="App">
      <Canvas
        style={{
          width: "100vw",
          height: "100vh",
          border: "1px solid red",
          backgroundColor: "black",
        }}
      >
        <ambientLight />
        <Test />
      </Canvas>
    </div>
  );
}

It seems the loader is not able to parse the geometry data from the 3MF asset. Hence you get an empty group object with no meshes defined. If you compute a bounding box with this input, the AABB keeps its default values.

2 Likes

After some debugging it seems the model makes use of the 3MF Beam Lattice Extension extension which the loader does not support.

1 Like