This would be an awesome addition, specially when the original mesh could be animated while only the subdivised mesh is visible
The way I understand it, you can’t do it with shader only, because WebGL does not support geometry shader.
It leaves you with doing the subdivision in JS. While it has some uses, I guess it’s less interesting (you can’t easily have it based on distance from viewpoint, you need to animate the generated points, you can’t do more than a few subdivisions…).
I have tried to translate some functions i found but no luck so far. Even just doing the subdivison did not work. Tried chatGPT too. You have some working script?
I recently ported some CGAL code to webassembly CGAL 5.5.2 - 3D Surface Subdivision Methods: User Manual,
this includes all the subdivision methods you can find. I will probably make a demo tonight or tomorrow EDT.
cheers!
Here is one example that does not render an error but does not show the subdivided mesh somehow:
I would be grateful with some working code.
Hi everyone,
I’ve been working on implementing the Catmull-Clark algorithm in Babylon.js and wanted to share a few observations.
(Of course, I relied heavily on AI for this, as my math skills aren’t quite up to solving problems like this alone. )
Catmull-Clark works best with quads, but since Babylon.js meshes are typically made of triangles, this can complicate things. You’d either need to convert triangles to quads or handle mixed topologies like triangles and N-Gons, which often results in less smooth surfaces.
For triangle-based meshes, it might actually be better to use Loop Subdivision, as it’s specifically designed for triangle topologies and gives better results without needing to convert the mesh.
Performance is another consideration; with multiple subdivisions, vertex and face counts grow exponentially. Using LOD can help manage performance in real-time applications.
Has anyone else tackled subdivision for triangles in Babylon.js?
We do not support subdivisions by default in Babylon and I like the idea of more tooling for it
As everything (excluding sprites, lines, points, GS…) is mostly triangles I wonder if the algorithms for quad conversion would be good enough in the general case or if a triangle based approach would be more convenient to use ?
Following this thread because I also love the idea of subdivisions in Babylon. That was a neat Catmull-Clark demo!!
The procedures for Catmull-Clark and Loop are very similar, but I believe they do yield different results. This is demo I made a while ago to compare the two. (I just can’t remember how I represented the geometry for each mesh, hence why I’m not 100% sure )
Also found this image online that compares Catmull Clark applied to two different topologies of the same shape.
If anyone can get more tests like these, I’d love to see!
If we did decide to implement subdivision, it might make sense to eventually have a handful of methods to choose from, since each has its own pros and cons (computation speed, rate of convergence, crease handling).
For this reason, we might also want to carefully decide how we decide to track mesh topology. There are several data structures for this. We’d ideally want one that can support the most popular subdivision methods and topologies. The question is which structure does that best, or maybe they all handle it the same.
I’m curious how CGAL does it…
That would be a NEAT addition to NGE!
Glad you all liked the demo!
I agree—having more tooling would definitely be nice.
How do you think it should be integrated into the codebase? I was considering extending the Mesh
class to allow calls like myMesh.subdivideWithCatmullClark()
, or perhaps using a static helper class instead.
I tested the algorithm with triangles, but the results were often odd or unpredictable. That’s why I attempted to convert triangles into quads beforehand, though this turned out to be a non-trivial problem (which could actually make for an interesting new feature!). I know Blender has this functionality, but I’m not sure which algorithm they use for the conversion.
As @alexchuber mentioned, there are many variations of these subdivision algorithms:
While trying to apply the Catmull-Clark algorithm to a BABYLON.Mesh
, I ran into challenges. Along the way, I stumbled upon the Loop Subdivision algorithm and ended up implementing it instead. Here’s the demo:
I used a cube for these examples because it’s a commonly referenced geometry in research papers and visuals, making it easier to compare results. However, it definitely needs more testing with diverse geometries.
While there are examples in wasm, it should be better to have a webgpu compute shader implementation
https://www.pmp-library.org/subdivision.html