MeshBuilder.CreateLines and Light

Is there a way to use lights on MeshBuilder.CreateLines?
This is my current scene and I would like to apply light to it (In a way that if a point of the line is more distant in z axis it should be more dark).

Hiya V. A darned good question you ask.

I don’t think there is a way to do that… but let’s wait for wiser comments… especially from @jerome , if he isn’t laying on a beach somewhere. :slight_smile:

Meantime, here’s a playground demo where someone used “tubes” instead of lines.

I see there’s a little fog/dust drifting thru the light volumes… a little added “pizzazz” :slight_smile:

Stay tuned for more/better answers/ideas.

1 Like

nope, you can’t directly.
But you can (same with the LineSystem) simulate it from your own by :

  • creating an updatable Line or LineSystem mesh
  • computing each frame the distance of each vertex from the camera position (if the cam or the Line moves)
  • setting a different color or alpha to each Line vertex according this distance (farther / darker)
    MeshBuilder - Babylon.js Documentation
1 Like

Cool. :slight_smile: Thx J!

With that idea, no single line segment… could have a color change or color dithering… “along the way”.

Likely, the only way to make that look anywhat tolerable… is to never allow a long line-segment in any direction. Long straight runs would be subdivided into many short straight runs. Then, yeah, distance of segment from fake light… determines line segment color. Erf.

I think that would look very strange, no matter how much line segment sub-dividing was done. What strange ideas Jerome thinks-up. :slight_smile:

I wonder… hmm… a “wagon-train” of SPS lowest-rez boxes… might be fun. SPS lines, v1.0. But likely, that would be perf-heavier than tubes. hmm. I think this idea is stranger than Jerome’s.

Nah, 3-sided tubes… or 0-subdivided 3-sided uncapped cylinders, too. They’re all pretty low-budget, I believe.

What if .useTubes was an option for linesMesh, or what if .updateTubes was an option for “tubesMesh”? Woah. :slight_smile: What if Wingnut stopped thinking-up stupid ideas? heh.

Actually I think the along-the-way coloring should work because the colors are interpolated between both the segment vertex. If you set the vertex A with the color white and the vertex B with the color “almost black” (very dark grey), the segment should be smoothly colored from white to almost black along its length.
That’s what I did in some demos about rain falls (no idea what are the related PG).

2 Likes

Oh yeah, like the colors, here: https://www.babylonjs-playground.com/#1UHFAP#60

Interpolated colors between two differently-colored vertices. Yep yep yep. hmm. Thx J.

1 Like

Hey @Wingnut! Thanks for the tube example, it took me to ExtrudeShape and I think I’m gonna try this next time.
Cheers!

1 Like

Hey @jerome. Thanks for the explanation of “simulation” method, I did just that and it looks good enough. But next time I’m gonna try Ribbon or maybe some other parametric shape.

(I’m posting screenshot only because I use ES6, didn’t try it in the playground)

3 Likes

One thing I learned back when trying to do hair with lines is the lines submesh uses it’s own shader, not std or pbr material.

You might build the linesmesh, then such out the vertices into a normal mesh, then you could use a std or pbr material.

1 Like

Hi JCP. Would that material/shader… need to be a type of “wireframe” mode? I’m not real educated on ANYTHING, esp how shading and clockwise/ccw facets/indices… get rendered. It seems… with a std material… (and depending upon how the indices get added), it might be a z-fighting festival.

(points happening within enclosed volumes?)

To me, wireframeMode is some kind of magical thing that only MeshMasters and Shaderians understand. :slight_smile:

1 Like

Linesmesh class is just a bunch of triangles which are collapsed. Webgl doesn’t support lines as I remember. This was just a cheat by using triangles where 2 of the points are in the same place.

1 Like

I think WebGL can handle lines. Actually, points, lines and triangles.

1 Like