https://github.com/randomgamingdev/greedy-meshing-js-demo

A demonstration of greedy meshing in Javascript with p5.js used for voxels and more
https://github.com/randomgamingdev/greedy-meshing-js-demo

algorithm algorithms basic demo example greedy-algorithm greedy-algorithms greedy-meshing javascript p5js quickstart simple

Last synced: 4 months ago
JSON representation

A demonstration of greedy meshing in Javascript with p5.js used for voxels and more

• Host: GitHub
• URL: https://github.com/randomgamingdev/greedy-meshing-js-demo
• Owner: RandomGamingDev
• License: mit
• Created: 2025-03-02T21:12:29.000Z (4 months ago)
• Default Branch: main
• Last Pushed: 2025-03-02T21:24:14.000Z (4 months ago)
• Last Synced: 2025-03-02T22:22:22.831Z (4 months ago)
• Topics: algorithm, algorithms, basic, demo, example, greedy-algorithm, greedy-algorithms, greedy-meshing, javascript, p5js, quickstart, simple
• Language: JavaScript
• Homepage: https://randomgamingdev.github.io/greedy-meshing-js-demo
• Size: 4.88 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Greedy Meshing Javascript Demo

### Greedy Meshing is a concept meant to adapt voxels, which are hard to compute, into large quads, making them easier and in many cases possible at all. 


Note: This example uses iteration per block for the column comparisons necessary for 2nd dimension (in this case x axis) expansion which is **NOT** the optimal method in terms of performance.

In the future, if asked I might create an example of efficiently doing it via bitwise operators, but to be very honest there are much better languages (e.g. C/C++, Rust, etc.) for demonstrating that and countless examples in them too.

This demo generates an image out of noise and then greedily meshes it into rectangles.

![Greedy Meshing Image](https://github.com/user-attachments/assets/0e0366c8-df27-45e5-8cf5-7597427ca0ae)

If you'd like to see how expanding down one dimension (in this demo the `y`) before expanding that down the other dimension (in this demo the `x`) works just enable the `DEBUG_VISUALS` to see 


![Greedy Meshing DEBUG_VISUALS Image](https://github.com/user-attachments/assets/454a1ddd-a9db-4808-a01e-e7401f01500f)