Making a json loader

[Taivas_Gogoljuk]

I’m trying to revive the io_three json loader by making a new one.
I’m trying to make a loader that has no loading screen, it shows the rendering process.
I wonder how much help can i get from here about the syntax and all.

First question, why does a texture need face data?
https://threejs.org/docs/#api/en/core/Face3
I can see the need for normals and texture colors, but the face is a bit confusing.

How about would I start to make sense of this data

animations: Array []
bones: Array []
faces: Array(22231) [ 42, 0, 7, … ]
influencesPerVertex: 2
metadata: {…}
bones: 0
faces: 2021
generator: “io_three”
materials: 1
morphTargets: 0
normals: 1315
uvs: 1
version: 3
vertices: 1378 Object { … }
morphTargets: Array []
name: “dashboard_prt_8Geometry”
normals: Array(3945) [ -0.671316, 0.442701, 0.594378, … ]
skinIndices: Array []
skinWeights: Array []
uvs: Array [ (902) […] ]
vertices: Array(4134) [ 10.6179, -4.83646, -0.489784, … ]

[looeee]

I’m trying to revive the io_three json loader by making a new one.

Why?

That loader is very out of date, as is the JSON format, and you should use a different format and loader such as glTF instead.

[Taivas_Gogoljuk]

You’re right. Right now I’m converting an fbx file with toJSON(), it seems like the resulting json file is 200mb from a 18mb file.

I would like to load the FBX file without a loading screen, by sending a part at a time.

Maybe if I zip the parts and unzip at client side I can down the transter to the original 18mb

[looeee]

Sounds like what you want is mesh streaming -check out this thread:

Progressive Mesh Streaming: Knowledge exchange

I’m going to write some sort of paper about Progressive Mesh Streaming for WebGL. Progressive Mesh Streaming is not a new technique, it already exists for many years. But it is particular interesting for web based 3D applications because you need to transfer all data of an asset over a (possibly slow) network before you can display it. To avoid the associated latency, you can try to compress 3D data in a way that allows streaming and progressive decoding. In other words: You do not load the ent…

Alternatively, you can get someway to that result by removing textures from your model and loading them after the main file. I do that on discoverthreejs.com. It doesn’t remove the loading screen but it does reduce the time it displays for quite a bit.

Check out the Sketchfab chapter in WebGL Insights for a more advanced and generic version - they load placeholder 16x16 textures with the model and then replace them with the correct textures in an order that isn’t visually jarring, starting with the opacity map.

If your model is relatively simple but has big textures this method will probably be as effective as mesh streaming and it’s a lot simpler!

[Taivas_Gogoljuk]

Hmm, not a lot of content there… I need to make it visually appealing, loading screens are the second worst common computing things after ads.

[looeee]

Nobody likes loading screens, it’s true. If you find a way to load up a complex mesh while avoiding a loading screen then please share your technique here. However, in my opinion, recreating the old JSON loader is probably not a good approach to take.

[pailhead]

I love loading screens. Why make this generalization?

[pailhead]

@Taivas_Gogoljuk

First question, why does a texture need face data?

Can you elaborate on this? Textures do not need face data, in fact they have nothing to do with meshes, it’s a completely different structure.

[Taivas_Gogoljuk]

pailhead: I love loading screens. Why make this generalization?

There still discontext. Waste of attention.

Can you elaborate on this? Textures do not need face data, in fact they have nothing to do with meshes, it’s a completely different structure.

I’ll look it up.

[Mugen87]

Textures need uv-data (texture coordinates) for correct texture projection. These data are geometric information and can be organized as face data (like Face3 does).