JSON models need to be replaced

[WestLangley]

There are 30+ examples that render legacy Geometry because JSONLoader returns Geometry.

We will need to use a different loader in these examples -- one that returns BufferGeometry. That means the following models either need to be converted to another format or replaced with a different model.

models/json:

• [x] (https://github.com/mrdoob/three.js/pull/14747) ~models/json/male02/Male02_dds.json~
• [x] (https://github.com/mrdoob/three.js/pull/14747) ~models/json/female02/Female02_slim.json~
• [x] (#14765) ~models/json/cubecolors/cubecolors.json~
• [x] (#14774) ~models/json/WaltHeadLo.json~
• [X] (#14769) ~models/json/suzanne_geometry.json~
• [x] (#14806) ~models/json/leeperrysmith/LeePerrySmith.json~
• [x] (#14924) ~models/json/lightmap/lightmap.json~
• [x] (#14788) ~models/json/QRCode.json~

models/animated:

• [x] (https://github.com/mrdoob/three.js/pull/14747) ~models/animated/horse.js~
• [x] (https://github.com/mrdoob/three.js/pull/14747) ~models/animated/flamingo.js~
• [x] (https://github.com/mrdoob/three.js/pull/14747) ~models/animated/sittingBox.js~
• [x] (https://github.com/mrdoob/three.js/pull/14747) models/animated/monster/monster.js (moved)

models/skinned:

• [x] (#14781) ~models/skinned/simple/simple.js~
• [x] (#15132) ~models/skinned/knight.js~

Suggestions?

EDIT: Edited by @donmccurdy and @Mugen87 to track progress.

[Mugen87]

I vote to convert the models to glTF. We could import them in the editor and then use the Export GLB option.

BTW: At some point, we might want to consider to move GLTFLoader into the core. Since it is the recommended 3D format of the project, it's only consequent to provide the corresponding loader in the main build.

[takahirox]

Thinking of Draco compression. What's the easiest way to make Draco compressed .glb now?

[donmccurdy]

I'm glad to work on converting or replacing some of these. I'll update the OP with ones I'm working on, in case others want to work in parallel. A few (horse, flamingo, monster) are already available in glTF format I think. The lightmap example would need to use another format though — glTF does not currently support lightmaps, just AO.

Maybe the lightmap model, and perhaps some others, should be updated to the newer JSON format, since having the ability to serialize objects to/from JSON is still valuable to maintain.

What's the easiest way to make Draco compressed .glb now?

The easiest way to add Draco compression to a model already in glTF format is by using glTF-Pipeline, that feature has just been merged to the master branch. Some conversion tools like FBX2GLTF also have Draco compression available as an option. I'd only use it for models where geometry is the dominant size factor, though, to keep things simple.

[donmccurdy]

This leaves me unsure what to do with examples like these:

• loader / json
• loader / json / claraio
• loader / json / objconverter

They exist to show the use of JSONLoader, so changing the format is pointless... How about we remove the second two, keep the first using a single model moved somewhere like examples/models/json/legacy/*. That would be the only example using JSONLoader and Geometry, once changes above are done, and eventually both Geometry and JSONLoader will be moved out of src/ into examples/js, I assume?

[WestLangley]

It's up to @mrdoob, but maybe remove those examples and use the models in webgl_shadowmap.html as the basis for the legacy JSONLoader example.

[donmccurdy]

i would agree with that, and —

1. rename loader / json to loader / json / legacy
2. rename loader / claraio to loader / json (it uses THREE.ObjectLoader)
3. remove loader / json / objconverter

14747 does (3).

[mrdoob]

1. rename loader / json to loader / json / legacy

I would remove this one too, but we do need an example loading a lot of animated characters though.

2. rename loader / json / claraio to loader / json (it uses THREE.ObjectLoader)

Sounds good.

[mrdoob]

eventually both Geometry and JSONLoader will be moved out of src/ into examples/js, I assume?

Yeah... Somehow... 😅

[donmccurdy]

I would remove [loader / json] too, but we do need an example loading a lot of animated characters though.

So we'll remove all examples of JSONLoader in this process? shadowmap / performance seems pretty good as an example of many animated characters, or would we add another specifically for that?

[mrdoob]

That is true. shadowmap / performance should do the trick.

Yeah, I think we should remove all JSONLoader usage. It's okay to still use ObjectLoader.

[Mugen87]

I have converted knight.js to glTF via GLTFExporter today. Unfortunately, the resulting knight.glb is over 12 MB (the original JSON file is just 4.1 MB). Any ideas what we should do in this case? Using a different model? AFAIK, knight.js is currently the only model in the repo that combines skeletal animation with morph target animation. I have tried to Draco-compress the model via glTF pipeline but unfortunately the morph target animation is distorted after this process.

@donmccurdy The code of your PR #15011 was very helpful in order to create the glb.👍

[looeee]

AFAIK, knight.js is currently the only model in the repo that combines skeletal animation with morph target animation

I was testing adding morph targets to the FBX samba model a while ago. I can work on that some more if there is interest.

[donmccurdy]

Unfortunately, the resulting knight.glb is over 12 MB (the original JSON file is just 4.1 MB).

Some of that is related to the BufferGeometry.fromGeometry( geometry ) conversion, which is called automatically by GLTFExporter during export. That adds white vertex colors at least, and may also be spitting the mesh vertices into triangle soup. The source mesh has 16980 vertices but the generated glTF has 98436.

I've been looking for some nice CC-BY examples online that use both skinning and morph targets but haven't found anything I like yet. Having morph targets control facial animations is an illustrative use case, which wouldn't be possible on the Samba model, so I'm not sure about that.

[looeee]

Having morph targets control facial animations is an illustrative use case, which wouldn't be possible on the Samba model, so I'm not sure about that.

Agreed, I was thinking of something much simpler like shrinking / growing the head. However a model that demonstrates facial morphs plus skeletal movement would be ideal.

[Mugen87]

I've been looking for some nice CC-BY examples online that use both skinning and morph targets but haven't found anything I like yet.

Same here :disappointed:

[donmccurdy]

How about this? https://www.patreon.com/posts/free-animated-22105894

It's 500kb, CC-0, and has 14 skinning animations. I added three morph targets for facial expressions in Blender: demo.

[looeee]

Looks great! 🤖

[Mugen87]

Cool! I vote for this model :blush:

[Mugen87]

JSONLoader is still used in THREE.UCSCharacter. The corresponding example is:

https://threejs.org/examples/#webgl_morphtargets_human

I wonder if this example is still necessary since the new skinning/morphing example allows the manual editing of morph target influence values, too.

[WestLangley]

Agreed. That example uses legacy Geometry and can now be removed.

Many thanks to those who helped with this!

Closing.