Jump to content

Working LinesMesh example?


Recommended Posts

Hi Jeti... welcome to the forum!
The 'createLines' constructor... instantiates a LinesMesh.  So, the #2 built-in playground demo... shows a working LinesMesh:

http://www.babylonjs-playground.com/?2  (code lines 35-40)

Want to see the trail?

It all starts here:  https://github.com/BabylonJS/Babylon.js/tree/master/src
Even though you see the babylon.linesMesh.ts and .js in that folder, we won't visit there yet.
Instead, choose  babylon.mesh.js  and scroll to line 1383
See line 1389?  Yep, we're off to BABYLON.MeshBuilder.CreateLines  We went from Mesh class, to MeshBuilder class.  It adds more features to the Mesh Class
Notice line 146.  There's our BABYLON.LinesMesh instance, but we still have no "shape".  Shapes are often formed with BABYLON.VertexData object
Notice line 147.  Essentially, this says go to BABYLON.VertexData.CreateLines(options) and retrieve some vertexData based on 'options', then return here.
So, lets go visit a VertexData object... BABYLON.VertexData.CreateLines  
    [odd thing: Notice we are in the BABYLON.Mesh.VertexData class, even though line 147 calls BABYLON.VertexData.CreateLines.  I'm not sure why.]
Then VertexData.CreateLines does some serious work, and returns the resulting VertexData object in line 932
Now back to BABYLON.MeshBuilder.CreateLines line 148.  A VertexData object has a function called ApplyToMesh()
That is called in line 148.  VertexData holds data that it created with its own CreateLines() method.  That data is applied to the LinesMesh we instanced in line 146.
Line 149, we are headed back home... to https://github.com/BabylonJS/Babylon.js/blob/master/src/Mesh/babylon.mesh.js#L1389 and done.

Gruesome trail, eh?  TMI, eh?  :)  Hope this helps.  Again, welcome... good to have you with us. 

Link to comment
Share on other sites

59 minutes ago, Wingnut said:

haha.  Jeti's question sits unanswered for 6 hours, and then suddenly FOUR of us answer at once?  What the heck?

This is my first post. It had been hidden until a moderator cleared it. I assume it's to avoid link spam.

This community seems to be crazy helpful. Thank you and give me some time to work through the replies.

Link to comment
Share on other sites

I saw the LinesMesh mentioned in a thread on how to create a grid. The initial solutions made use of shaders and textures. Therefore I got the idea that the LinesMesh is something different than what Mesh.createLines produces. Feels a bit stupid in retrospect.

Now I have a followup question: Is there a way to draw line segments instead of a continuous line? 



Link to comment
Share on other sites

Hey Jeti... you can use parametric tube shapes as the segments of your grid.  http://playground.babylonjs.com/#TDUK0#24   As you can see, they are nice and straight, and they have barbs sticking out to keep woodland critters from walking on your grid at night, and leaving mounds of...

Okay, okay, just joking around with you a little.  :D

Keep in mind that textures can do grids, too.  http://playground.babylonjs.com/#1O9A7#1

With some creative use of alpha/transparency, you can command your grid planes to show, partially-show, or hide... the surface between the lines.

Don't forget what Adam mentioned... our cool Playground Search.  http://doc.babylonjs.com/playground?q=grid   Have fun!


Link to comment
Share on other sites

Searching the playground sounds useful. I'll keep that in mind.

For now, I'll stick with this solution: http://www.babylonjs-playground.com/#LBRTP#3

It uses only one LineMesh. The drawback is that parts of the outer edges are drawn twice, which becomes visible if alpha is used. It's good enough for now. I don't think there's support for vertex colors on LineMeshes.

Link to comment
Share on other sites

just PRed the new mesh type : LineSystem

var lineArray = [line1, line2, ..., lineN]; // each line is an array of successive Vector3
var ls = BABYLON.MeshBuilder.CreateLineSystem("ls", {lines: lineArray}, scene);

This will create a single mesh composed with all the lines declared in the array lineArray. So only one draw call.

Link to comment
Share on other sites

But but but... hmm.  Jeti, I realize that there is 45 LBS of "fancy" draped atop Jerome's demos, but, I just bet... Jerome's solution does not satisfy your request.

Jerome, can your system do...

 BABYLON.Mesh.CreateLines("lines", [
     [new V3(someXYZ), new V3(someXYZ), new V3(someXYZ)],   // a 3 point line somewhere in space
     [new V3(someXYZ), new V3(someXYZ)],   // a 2 point line somewhere in space, maybe not attached to the first
     [new V3(someXYZ), new V3(someXYZ), new V3(someXYZ), new V3(someXYZ)],   // a 4 point line (possibly detached) somewhere in space
     [new V3(someXYZ)]  // a dot?  :)


And then... how about LinesMesh.vertMarker = var of any mesh... that gets instanced/cloned and placed at each vertex of all the lines!  Wow!

Anyway, the above code template might be what Jeti seeks.  Maybe your new system can do this.  I don't think so.  As best I can tell, your system does programmable auto-instancing.  Still learning, though.  :)

Link to comment
Share on other sites

:)  So now, let's see, we need each line to have its own color.  Later, we'll try for each segment of line to be a different color.  :)

Then, what?  A line weaving contest?  Cloth-making... with lines?  Yeah!

Speaking of balls, they have a street in Las Vegas (Fremont Street) that has a domed roof for about 4 blocks, with a few (million) RGB light bulbs attached.


Something made me think about it, recently.  ;)  But I suppose the lines would be unnecessary for that.  Just balls-to-the-walls to simulate that thing (and an image buffer-to-balls function).  Dementedly delicious, and retro!  Why use pixels when we have spheres, eh?

Oh yeah, this is a thread about lines, not spheres.  I forgot.

Link to comment
Share on other sites

@Wingnut about the LineSystem :

1 ) yes, each line can be absolutely independant from the others, so you can design a ladder, a grid, a ruler, hairs ...whatever you want what is composed with lines actually. It just will build a single mesh instead of one mesh per line as with the current CreateLines() method.

2 ) for now, the LineSystem color is limited to a single one for the whole system. I intend to provide per-line, per-segment, per-point colors also. This needs to recode the shader used by the LineMesh class... so I first need to lean how to do this. Temechon will teach me this ;-)


BTW, I just PRed a fix so the UserFunction _showNormals()_ now uses a LineSystem instead of hundreds or thousands individual line meshes : https://github.com/BabylonJS/UserFunctions/blob/master/showNormals.js

documented also, very soon here : http://doc.babylonjs.com/tutorials/Mesh_CreateXXX_Methods_With_Options_Parameter

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...