Deluanay Triangulation shaders?

Alright! Thanks for the input! Hopefully i can start soon!

–SonicX278 

Yeah what StarCrunch said.If I understand correctly the definition of a Delunay Triangulation guarantees ( or rather requires) that the circumcirle of one of the triangles wholly inscribe that and that traingle only. With random walk that principle may be violated. And when that happens, there isn’t any ‘rhythm’.  

P.S : Please forgive me if I am wrong, only recently I started looking into the complex math of this topic after realizing I have a use for this. 

Did anyone have any update on this?

Thanks. 

I was playing around with a piece of code I have but I haven’t had time to keep working on it.

I have the shapes spawning randomly.

@ farjadfarabi_czs

While looking for some material for somebody else, I actually ran across a write-up on rakoonic’s effect, along with some Voronoi-related material. (And then forgot to post it.  :P) See in particular the various articles under Procedural Content here.

I’m not sure this will actually get you anywhere, but you seem to show an interest in this stuff anyhow.  :slight_smile:

Wow, One of the voronoise samples is basically Corona’s Crystallize filter. You were right about crystallize using voronoi. :smiley:

Actually, instead of triangles, squares (like on the link) are also interesting alternative. 

rakoonic ported a Voronoi-based technique here: shader Voronoi diagrams and Delaunay triangulation are dual to one another–the state of one describes the other, and vice versa, albeit in a different way–so it possibly fulfills what you’re after.

That said, the “low-poly” bit doesn’t seem strictly related. Do you have a particular use in mind here?

Hi StarCrunch

Thank you for your response. 

By low-poly i meant this type of art style, and they utilize deluanay triangulation in some sort or form to generate the style 

http://static.wixstatic.com/media/d069d3_3aa663fb7b9cca386f5582508e2ac99b.png/v1/fill/w_459,h_443,al_c,usm_0.66_1.00_0.01/d069d3_3aa663fb7b9cca386f5582508e2ac99b.png

Now in Github there are lot of JS libraries that can achieve this. But it seems nearly impossible to transfer those to pure Corona SDK lua. 

More specifically, 

I meant this type of use 

http://asifmallik.github.io/  put any image there and you can see what i meant. 

Honestly i think i could write a plugin module for that but it would probably take some time.

–SonicX278 

You probably wouldn’t gain much from doing the Delaunay triangulation in-shader (though I’d enjoy being proven wrong here), seeing as it’s really a big preprocessing step. Roland Yonaba (of Jumper fame) has some code for it (in Lua) here. There’s a decent chance you could simply use a bunch of polygons, the trouble being to come up with a decent point cloud to triangulate.

How difficult this might be would depend a lot on the quality you’re going for, which in turn depends on your access to the color information. If you don’t care so much about well-distributed colors you could just generate a reasonably fine jittered grid and then triangulate those points, using the color at each point in the original.

Otherwise, you’ll have to accumulate some info, and there indeed some shaders could come into play, for instance by doing a multi-pass reduction to plant the average RGB (and maybe a low-res x, y offset in the alpha channel) into some small rects that you could then sample, coalescing near-enough colors. Perhaps this same idea could also work well in tandem following a Sobel filter, though that’s probably a bit more work.

I ported some Worley noise code (e.g. see Drilian’s patterns here) if that might be useful.

Hi StarCrunch, yes currently I am trying to use the github Lua module by Yonaba to generate the triangles, with somewhat success. But then the question becomes how do I apply that trinagle (or mesh) field on an image? The low-poly art style usually implements ‘average blur’ on each of the trinagles. OR just gets the RGB value at the exact center of each triangle and fills the entire triangle with it. I assume RGB access isn’t something available yet in Corona? Using blur would also mean I would have to apply blur to  specific areas (triangle shaped) of the image ( like having a polygon layer on top of the image and apply blur so that it effects the image underneath I guess? ) many times. Is that possible ? The reason I was thinking shader is because Corona already has a built in shader called ‘Crystallize’ which is very similar to low-poly, except the Corona SDK one isn’t triangular ( pentagon). 

On a related note, Drilian’s Worley noise comes very close to what I would want to achieve, except in triangular shape and 

instead of the seemingly random (?) color fill, I would just have to use blur OR RGB fill from the image. But then it’s the same question again.

Sonic, that would be great :D 

this type of ‘low-poly’ art is the hottest new trend and any app including games could benefit from it. 

If someone doesn’t beat me to it I’ll give it a go! I have a couple clients and plugins/modules to finish up first though.

–SonicX278

I was going to start on this for another project I’m working on, but I’ll put that off since you’re working on it @Sonicx278. Looking forward to seeing what you produce!

Awesome! Well like i said i have a couple clients and plugins to finish up and then i can start. @Alex@Panc – If you do end up starting on it please post back here so I know if i should or not. Thanks!

–SonicX278 

@ farjadfarabi_czs  I’m curious how much success “somewhat” is.  :D If you have the proper boundary and simply need to fill in the interior colors, the rest will probably be fairly straightforward.

Crystallize might even be using Worley. I think Drilian’s version does use random colors, yes. Apart from the rough geometry of the noise algorithm you can impart quite a lot of variety to it. For reference, my ported code for it is included among the code I used during the Corona Geek shader shows, recent snapshot here. (Some bugfixes pending, just a bit lazy about updating.  :))

The color is a pain if you need to hoist it out from the GPU, e.g. with display.colorSample(), but easy enough on the shader. The blur version might be a bit more work (because you’d have to fight interpolation if you want to sample in the fragment shader; not an issue if your GPU allows it on the vertex side), but if you can pass the triangle’s centroid (or some other preferred center) in through the userdata you’ve got a lot of what you need.

@ SonicX278  If you’ve not already got a technique in mind, one idea might be to build on what I’ve just mentioned and render those colored triangles into a canvas, then re-create the image / sprite using that instead. (And allow this to be saved, so this could be done during development and transparent to the end user.)

Do you think just creating a whole bunch of polygons with three vertices would be easier?

–SonicX278 

For a still image, yes. For a sprite, not so sure… But don’t let that stop you!  :slight_smile:

AlexPanc, just curios, were you thinking to use this one a game?

I should mention that I am looking for this to use as a graphics effect on a puzzle game I am working on. I could just use the 10+ websites that do low-poly art and load the images as part of my app, but I am also adding the option so users can add their own photos and for that I need to be able to generate this within the app.

StarCrunch, display.colorSample(), I had no idea such a method existed. :open_mouth:

The lua delunay module has a method where it calculates the center of a triangle. 

And speaking of “somewhat”, right now I just split the Area into small squares and pass the corners of those squares as vertices and triangulate them. I know it’s not ‘random’, but the mesh generated looks okay enough for use. 

I think for a start i could do still images and then after polishing that up i could add sprite support.

–SonicX278