# Highlight some paths on hover on a sphere with a gridMaterial **URL:** \ **Category:** Questions\ **Tags:** material\ **Created:** [July 20, 2022, 5:30pm UTC](https://forum.babylonjs.com/t/highlight-some-paths-on-hover-on-a-sphere-with-a-gridmaterial/32344 "2022-07-20T17:30:18Z")\ **Posts on this page:** 8\ **Page:** 1
**Author:** ![Dominux](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/dominux/32/25482_2.png) [@Dominux](https://forum.babylonjs.com/u/Dominux)\ **Post date:** [July 20, 2022, 5:30pm UTC](https://forum.babylonjs.com/t/highlight-some-paths-on-hover-on-a-sphere-with-a-gridmaterial/32344/1 "2022-07-20T17:30:18Z")
Hi there Here’s my [Playground](https://playground.babylonjs.com/#I999U8%234) I’d like to highlight lines intersection by a circle of a different color or ton, on hover on them. Accuracy is clearly defines as a circle radius: everytime you hover to any lines intersection closer than the radius - circle appears, when you get outta it - it disappears ---
**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\ **Post date:** [July 20, 2022, 5:44pm UTC](https://forum.babylonjs.com/t/highlight-some-paths-on-hover-on-a-sphere-with-a-gridmaterial/32344/2 "2022-07-20T17:44:52Z")
You would need a different shader for that unfortunately ☹ I hope the community will come up with smthg highly creative regarding this 🙂 ---
**Author:** ![Blake](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/blake/32/21509_2.png) [@Blake](https://forum.babylonjs.com/u/Blake)\ **Post date:** [July 22, 2022, 10:46pm UTC](https://forum.babylonjs.com/t/highlight-some-paths-on-hover-on-a-sphere-with-a-gridmaterial/32344/3 "2022-07-22T22:46:10Z")
Heya, here’s a PG demo of one way to do this that I’ve been playing with. 😃 So on the mouse move event the nearest grid joint’s position is calculated and passed to the shader. The constant named cutoff (line 79) filters out the faded/empty areas in between the 6 main sections of the grid, in case you need to adjust that… And then the NME version of the GridMaterial has a small customization to draw the circle (most of the new blocks are in the Circle frame in the upper-right corner of the graph). Hope it helps and let me know if you have any questions about it. 🙂 > **[Babylon.js Playground](https://playground.babylonjs.com/#5RK72B%2310)** > > Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes ---
**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\ **Post date:** [July 22, 2022, 10:54pm UTC](https://forum.babylonjs.com/t/highlight-some-paths-on-hover-on-a-sphere-with-a-gridmaterial/32344/4 "2022-07-22T22:54:36Z")
This is great !!! Keep up this amazing work !!! ---
**Author:** ![Dominux](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/dominux/32/25482_2.png) [@Dominux](https://forum.babylonjs.com/u/Dominux)\ **Post date:** [July 25, 2022, 3:59pm UTC](https://forum.babylonjs.com/t/highlight-some-paths-on-hover-on-a-sphere-with-a-gridmaterial/32344/5 "2022-07-25T15:59:02Z")
Can’t reuse the code localy As I see, it uses [some snippet](https://playground.babylonjs.com/#YCMALW#7). Can’t load it either 😄 ---
**Author:** ![Blake](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/blake/32/21509_2.png) [@Blake](https://forum.babylonjs.com/u/Blake)\ **Post date:** [July 25, 2022, 4:06pm UTC](https://forum.babylonjs.com/t/highlight-some-paths-on-hover-on-a-sphere-with-a-gridmaterial/32344/6 "2022-07-25T16:06:38Z")
It uses a NodeMaterial which must be loaded. If you have internet connection it should work as is but you can also click on the material’s link below, then on the right-side menu, under File, click Save to save it to a JSON file. And then you’ll need to use [ParseFromFileAsync](https://doc.babylonjs.com/divingDeeper/materials/node_material/nodeMaterial#loading-from-a-file-saved-from-the-node-material-editor) instead of ParseFromSnippetAsync. 🙂 > **[Babylon.js Node Material Editor](https://nme.babylonjs.com/#YCMALW%237)** > > Babylon.js Node material editor - shader-based materials editor for Babylon.js ---
**Author:** ![Dominux](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/dominux/32/25482_2.png) [@Dominux](https://forum.babylonjs.com/u/Dominux)\ **Post date:** [July 25, 2022, 7:20pm UTC](https://forum.babylonjs.com/t/highlight-some-paths-on-hover-on-a-sphere-with-a-gridmaterial/32344/7 "2022-07-25T19:20:15Z")
Nice, yeah, it worked. I was a complete dumb BTW can I set color for a circle? 😄 ---
**Author:** ![Blake](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/blake/32/21509_2.png) [@Blake](https://forum.babylonjs.com/u/Blake)\ **Post date:** [July 25, 2022, 7:40pm UTC](https://forum.babylonjs.com/t/highlight-some-paths-on-hover-on-a-sphere-with-a-gridmaterial/32344/8 "2022-07-25T19:40:34Z")
No worries, you can set the value of the “circleColor” block to whatever color you want like this on line 59 . 🙂 > **[Babylon.js Playground](https://playground.babylonjs.com/#5RK72B%2311)** > > Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes