I am trying to fix up some light gradient bugs and I finally realized what is going on with this:
And here is a playground to demonstrate the issue:
As you can see I can’t seem to create the same gradient on all corners of the box face.
Does anyone know how I could do this or maybe something else I should try?
Can you describe in more detail what you want to accomplish? Maybe provide a hand drawn sketch or a mock up image created with a graphics program (or is the image above what you are striving to achieve?). I don’t understand what you mean by “create the same gradient on all corners of the box face”.
But I’ll take a guess at what you’re asking for…
If you’re trying to have a gradient in which all corners of the face start with the same color and they converge on a different color in the center of the face, I’d probably create a material for that instead of trying to do it with vertex colors. The only way you could accomplish it with vertex colors is if you had a vertex in the middle of the face (which I’m guessing your geometry doesn’t have).
Here’s an example I created using the Node Material Editor: https://nme.babylonjs.com/#HUF1P1#2 (Scroll down to the bottom of the editor panel on the right to see a preview of this material on a plane.)
If this isn’t what you’re looking for, let us know and we can try to provide other options.
Thank you for the reply!
The best visual example I can provide is something like this:
Basically just Minecraft style lighting.
As you can see the colors around the faded off to form a smooth diamond shape.
The one I wrote can only be smooth on the +X -Z and -X +Z vertices.
Basically the way it is done is by calculating a total light value for each vertex and producing a gradient.
So, maybe I could change the shader a bit to do that? I wrote a custom fragment and vertex shader.
Thanks for the additional detail. It helps, but I’m still a little unclear. Was my example close to what you wanted or no?
Here’s an updated version that uses colors which more closely match what you show above in case that helps you judge the solution: https://nme.babylonjs.com/#HUF1P1#3
And here’s a image of that result (for quick reference):
So, I do not think that solution is exactly what I am looking for. As there is still a visible seem down the cross section of the face.
The geometry in the voxel engine only has four vertices. Basically I am looking for a way to do smooth gradient on each corner of the box face.
In the playground I provided the meshes on the right look exactly like I want them to while the ones on the left have a seem down the cross section.
The only other thing I found online that is close to this problem is this:
Their suggestion is to break the mesh down more into 4 quads per face. But not sure if I want to do that.
I am sorry if I am not being clear enough.
Your NME shader is very close to what I am looking for.
It just needs to shade from the corners of the plane instead of the sides of the plane.
If that makes sense.
All right. I got an idea.
I will post about it if I figure it out.
This might take me a while to implement.
But as you can see in the picture I posted those are clearly “edge cases”.
So, what I can do is detect the edge cases and flip the quads (box faces) to correct the gradient.
This will take a while to implement but seems like the most logical thing to do right now.
In this article the author talks about the problem a bit:
But any way I will remain open to ideas if anyone has any.
So, I posted the question on reedit and someone replied with this good article describing my exact issue:
Then I made a playground with the flipped quads:
So, going to work now to make this happen in the engine. Will be a little bit of work but I think it will be worth it.
Thank you for all the help!
If anyone was curious I did get this working. So, the above solution is the correct one.
I just had to implement a system to detect the edge cases to see when to flip the quads.
Here it is working:
Amazing finding, thanks 
Bookmarked it just in case. I luv it when people solve their own issues and post the result here. 
…Yeah, I know, I’m a bastard just wanting to soak-up the knowledge hardly acquired by others 
