# How to create gradient colored mesh or surface like matlab in babylon?

**URL:** <https://forum.babylonjs.com/t/how-to-create-gradient-colored-mesh-or-surface-like-matlab-in-babylon/25796>\
**Category:** Questions\
**Created:** [December 5, 2021, 10:34am UTC](https://forum.babylonjs.com/t/how-to-create-gradient-colored-mesh-or-surface-like-matlab-in-babylon/25796 "2021-12-05T10:34:06Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![HaoQiRen](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/haoqiren/32/20183_2.png) [@HaoQiRen](https://forum.babylonjs.com/u/HaoQiRen)\
**Post date:** [December 5, 2021, 10:34am UTC](https://forum.babylonjs.com/t/how-to-create-gradient-colored-mesh-or-surface-like-matlab-in-babylon/25796/1 "2021-12-05T10:34:06Z")

</div>

how to create gradient colored mesh or surface like matlab in babylon? how to do that, Is there a demo?  
example:

```auto
[X,Y] = meshgrid(-8:.5:8);
R = sqrt(X.^2 + Y.^2) + eps;
Z = sin(R)./R;
mesh(X,Y,Z)
surf(X,Y,Z)

```

![mesh](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/b/b/bb71677cd9d348aa37e0289d16a7fbbcd1ed152b.png)

![surf](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/d/f/df010cfbd5abf6e7dfafabc976d373891b974fb0.png)

---

<div class="post-metadata">

**Author:** ![JohnK](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/johnk/32/26764_2.png) [@JohnK](https://forum.babylonjs.com/u/JohnK)\
**Post date:** [December 5, 2021, 1:11pm UTC](https://forum.babylonjs.com/t/how-to-create-gradient-colored-mesh-or-surface-like-matlab-in-babylon/25796/2 "2021-12-05T13:11:46Z")

</div>

Some examples of how it could be achieved.

Wireframe [Babylon.js Playground](https://playground.babylonjs.com/#PVJR78)

Using [gridMaterial](https://doc.babylonjs.com/toolsAndResources/assetLibraries/materialsLibrary/gridMat) - [https://playground.babylonjs.com/#PVJR78#1](https://playground.babylonjs.com/#PVJR78#1)

Colored wireframe [https://playground.babylonjs.com/#PVJR78#2](https://playground.babylonjs.com/#PVJR78#2)

---

<div class="post-metadata">

**Author:** ![Pryme8](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pryme8/32/7212_2.png) [@Pryme8](https://forum.babylonjs.com/u/Pryme8)\
**Post date:** [December 5, 2021, 5:49pm UTC](https://forum.babylonjs.com/t/how-to-create-gradient-colored-mesh-or-surface-like-matlab-in-babylon/25796/3 "2021-12-05T17:49:42Z")

</div>

[https://playground.babylonjs.com/#JKUDMY#2](https://playground.babylonjs.com/#JKUDMY#2)  
 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/1/3/131e0dc32d0dda726976e72a823a361ed72b32af.jpeg)

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/8/5/85e9610b0f9ab8ce7b06e80ff1990e35d8a45a18.png)

Then you would prolly need to use [Barycentric Genration?](https://forum.babylonjs.com/t/barycentric-genration/9994) this too to get the black lines with the color too.

---

<div class="post-metadata">

**Author:** ![HaoQiRen](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/haoqiren/32/20183_2.png) [@HaoQiRen](https://forum.babylonjs.com/u/HaoQiRen)\
**Post date:** [December 6, 2021, 11:15am UTC](https://forum.babylonjs.com/t/how-to-create-gradient-colored-mesh-or-surface-like-matlab-in-babylon/25796/4 "2021-12-06T11:15:24Z")

</div>

thank you!