[Solved] Store multiple objects in one json geometry in Three.js

You can easily store a BufferGeometry as json and load it using BufferGeometryLoader:

{
  "metadata": {
    "version": 3,
    "type": "Geometry",
    "normal": 30,
    "position": 30,
    "generator": "io_three"
  },
  "data": {
    "index": {
      "array": [ 0, 1, 2, 3, …],
      "type": "Uint16Array",
      "itemSize": 1
    },
    "attributes": {
      "normal": {
        "array": [ -1, 0, 0, -1, …],
        "type": "Float32Array",
        "itemSize": 3
      },
      "position": {
        "array": [ -1, 1, 1, -1, …],
        "type": "Float32Array",
        "itemSize": 3
      }
    },
    "groups": [
      {
        "count": 48,
        "start": 0,
        "materialIndex": 0
      }
    ]
  }
}

And to load it you may use the following code:

var loader = new THREE.BufferGeometryLoader();
loader.load(
'JS/Sample1.json',
function (geometry) {
    var mesh = new THREE.Mesh(geometry, new THREE.MeshNormalMaterial({}));
    scene.add(mesh);
    renderer.render(scene, camera);
    }
)

Now the question is storing more than one geometry in the json format. Is it possible to do so. If yes, is there any instruction or sample for it?

I’ve answered your question at stackoverflow :blush:

1 Like

Really appreciate it!