Material that sets a different color to different y-axis heights in the model

good day,
is there any playground or example of whats the easiest way to create and assign a material to a mesh that basically assigns different colors to the material depending on the y-axis (z-axis in blender) vertical height with smooth transitions between the colors? (basically a color ramp set vertically). So imagine for example a cube mesh, and the lower third of it has a color, the middle third another color and the top third of the cube another color, and you can change those colors and where the transitions are and how smooth or hard they are, it is basically a vertical ramp.

I attach a picture of the actual blend material. If I could manage to replicate this in babylon.js I could then get rid of the material in blender, and put it directly in babylon and that would help a lot with my exports from blender

You can try to start with something like that:

https://nme.babylonjs.com/#TR9E67

2 Likes

@Evgeni_Popov thank you very much I will give it a try :slight_smile:

@Evgeni_Popov I tried it but doesnt work well, the problem is that the material in the node editor has 4 colors, when I apply it to the mesh I load from blender only the fourth color appears filling the entire model, I guess that will never work because the good thing of exporting it from blender is that it adapts to the model exactly as I wanted, whereas in this case it doesn´t adapt properly, also the material appears as a solid color so i guess then I would have to add lights etc, whereas the baked blender material already comes with the light baked on it which is perfect, so the best solution seems still to be to get the baked blender materials, which actually works perfectly; its just that it has failed for me in certain cases so I was trying to find a universal solution but seems that i still will have to continue with the blender baked materials route

Yes, in that case getting the material from Blender is better I guess.

1 Like

@Evgeni_Popov maybe you can help with something else, in a trail i want the trail to have edges or a border so that i can distinguish the paths as it crosses itself, any node material template for a material where the color has borders? thank you :slight_smile:

I don’t know how to do that. The problem is that the trail is made of a lot of triangles and you would need to identify the triangles that are on the outside of the trail:
image
And then you would need to make the edge thicker.

[…] Maybe you can use the highlight layer:


https://playground.babylonjs.com/#JMEVMN#3

1 Like