Labeling ends of tubes

https://playground.babylonjs.com/#RUVIFN#1

Hi. newbie here :slight_smile:

My problem is - I want to draw tubes and then label the ends of tubes. Basically label the junction points.

I can create tubes and I can create labels. But the labels are always in the center of the tubes. I want to label the ends of the tubes.

I’ve tried playing with the offsets. Tried converting from 3D to 2D and using those values as offsets.

Any idea what I’m missing? Thanks

Hiya K! Welcome to the forum.

https://playground.babylonjs.com/#RUVIFN#3

I tried some stuff… especially line 44 - text0.moveToVector3(path0[0], scene);

Fail. :slight_smile: I can’t remember (or never learned) what that .moveToVector3() was used-for, or how.

I also tried text0.moveToVector3(new BABYLON.Vector3(-15, 0, 0), scene); (after linkWithMesh)… also failed. I think I’m using it wrong. Here’s some playgrounds that use it.

It had an interesting property name, though. I held hope for it… but it let me down. :slight_smile: hmm.

That was a good messy first playground, K… we LOVE seeing that stuff. It means “mad scientist at-work”… good stuff… lots of console.logs… watching things, learning things, yum! I took some of them out, but … yeah… you were doing some serious experiments… bounding box extends/measuring… all sorts of “grind”… love it.

Meantime… hmm… we COULD put tiny invisible meshes at each path[0] position, and put the labels upon THOSE, instead-of upon the tubes. shrug. Let’s listen for more comments. moveToVector3() might be broken.

MoveToVector3() source
Its partner func… moveToProjectedPosition() source

That’s the “control” class, base class for all GUI “widgets”. Internationally famous. :slight_smile:

The easiest way I have found to do it, is to use a TransformNode and place that where you want the label to show up, then link the text with the transform node.

https://playground.babylonjs.com/#RUVIFN#4

1 Like

Yeah, I’m a .NET programmer. Get me outside of Visual Studio and I feel lost :slight_smile:

1 Like

Thank you! Looks like that will work.

My concern is that most diagrams will have 1000 tubes and 500 labels. Let me get that configured and I’ll see how performance is

Your ideas worked. Thank you. Thought I would post a snippet of what I am doing. The code can be cleaned up with loops and such - but wanted to show the concept
https://playground.babylonjs.com/#RUVIFN#5

1 Like

I generated one structure with 1,026 tubes and 333 labels. Its very responsive. I’m impressed.

1 Like