WhitestormJS / whs.js

:rocket: 🌪 Super-fast 3D framework for Web Applications 🥇 & Games 🎮. Based on Three.js
MIT License
6.14k stars 391 forks source link

Implementing a module for LOD #74

Open sasha240100 opened 8 years ago

sasha240100 commented 8 years ago

As you remember from terrain updating issue #9 we need to improve terrain generation. And there is one post similar to http://threejs.org/examples/#webgl_lod how we can improve fps while rendering large objects.

thejmazz commented 7 years ago

Would be nice if LOD optionally could turn loops for that component on/off. So in addition to geometry detail, don't need to waste time on more expensive loops.

hirako2000 commented 7 years ago

I propose a smarter API than three.js way, e.g of usage:

const icosahedron = new Icosahedron({
     geometry: {
        radius: 100,
        detail: 5
    },
    module: [new LODModule(['detail']) // array should defaults to all instructions.
        .generate({
        levels: 5, // optional , default to some value, say 3.
        factor: 1/5, // optional (factor means for each step, substracted from the highest level, maybe a function instead?)
        floorLevels: true, // optional, to determine values should remain rounded, or get to decimals,
        range: [0, 100] //optional, perhaps default should be relative to camera near/far.
    })]
});

Such module would iterate through the first param, the array (here just detail). For each instruction it would iterate 5 minus 1 times (to end up with 5 levels of details), substract the highest level of detail by the factor on each iteration, flooring to rounded values for each level of detail.

sasha240100 commented 7 years ago

@hirako2000 such LOD module is only for primitive geometries and should interact with their API

thejmazz commented 7 years ago

a common mesh simplification algorithm is the one described by this paper: Surface Simplification Using Quadric Error Metrics. there's various implementations of it on the internet. in C. in Go (I actually have a WIP port of this to JS on my laptop, never pushed). theres definitely a C++ implementation in some game engine out there. this is out of the scope of whs, but the API should probably be something similar to what @hirako2000 suggests, and let you return your own set of meshes.

see also this three thread.

I think this also might be one of the cases where wasm could come in handy, and the tradeoff of moving items from js memory to wasm memory (at least before shared array buffers) would be worth it since the task is so large (can easily be on the order of seconds).

hirako2000 commented 7 years ago

So for non primitive you suggest using the already implemented SimplifyModifier in three?

thejmazz commented 7 years ago

For now yes, but to future proof for alternative mesh simplification algorithms, should accept a common format (array/object of meshes or something like that), basically have a way to pass in custom meshes for each LOD level (it should be possible to make a simple LOD switch from cube to sphere for example - not practical but a good example)