Draw a horizontal line around object on Mouse Hover

Questions
, , ,
1

I wan’t to draw a horizontal line around object on Mouse Hover in the mouse position like the following image.
Please, help me how can i do it ?
Screenshot from 2021-11-14 18-01-19

1 Like
2

Hi!
Modify your material, passing point of intersection, casted in object’s local space, in a uniform, then process this data in shaders.
HorizontalLine (1)

For a reference, have a look at this forum topic: Creation of rays passing through a 3D model

3 Likes
3

I appreciate your kindness @prisoner849 :pray: :heartbeat:

4

I had a similar problem once, when I wanted to draw height isolines across a digital elevation model. My solution was a 1-dimensional data texture (aligned along “v”), which I cast horizontally against the terrain.

In your case, a 1x1 data texture would be sufficient, with the textures .wrapS set to THREE.RepeatWrapping and the texture’s .offset.y set to the desired height.

1 Like
5

@Babak
Here is the example, whose gif is above: Edit fiddle - JSFiddle - Code Playground
I modified one of my previous examples, so names of variables may surprise :sweat_smile:

@vielzutun.ch
For isolines, I use this approach: Anti-Aliased Grid Shader - Made by Evan
Used it in this experiment with GPU raycast: GPU raycast - JSFiddle - Code Playground

6 Likes
6

Thanks again @prisoner849 :pray: :heartbeat: :heartbeat:
This is exactly what I want :smiley:
You’re very kind :smiling_face_with_three_hearts:

7

Thanks for sharing!

The approach I proposed originates from the time before the advent of shaders. It’s sort of a “legacy” approach, without the need for shader writing.
Your two linked versions are obviously superior in that the isolines have a constant width, while my approach (while perfect when viewed horizontally) shows considerable variations in line width, depending on the slope of the terrain, when viewed from above.

1 Like