Heatmap illustration for mesh difference, to signify fitment


I am new to babylon.js and I have tried looking for similar topics, there is a question on the same topic but without reverts so trying to engage the community with a new discussion.

How shall we go about showing the difference in two meshes to signify fitment. As an example let’s say there is a mesh which represents a body and another mesh which represents a garment on that body, let’s say an evening gown. The idea is to represent the difference in meshes (body and garment) using a color ranging Red => Yellow =>Green.

It is possible to achieve in babylon.js? In Python using the distance in between two meshes, this question on StackOverflow is an example which I could find from the Internet; it is possible.

I am looking for suggestions in the right direction; if you happen to have some example playground link than that would be fantastic.

Thank you for your time.

1 Like

Hello and welcome to the Babylon community! (very cool username btw :smiley: )

It’s certainly possible to do that on Babylon. You can calculate some measure of distance between meshes, and color the vertices accordingly: Updating Vertices | Babylon.js Documentation (babylonjs.com).

I think in your case, the hardest part will be how to define this “distance”. It looks like that the question you linked is a much simpler case, as it computes the difference between two very similar objects, where the pairs of points to be compared are already defined. In the case of a body and a garment, they will be very different shapes with different number of vertices.

1 Like

Distance and shading both, getting the gradient will also require precise shading of mesh which already has texture etc. So following the UV as well.