GUI Control linkOffset issue

Questions
1

I have a scenario whereas I will pick from a number of meshes which have different sizes. I have created an GUI advancedTexture containing a number of controls and link it to the mesh.

.
Now , I want the advancedTexture to appear exactly on the right and top side of the mesh. In order to do that I need to calculate the mesh height and width which Babylon returns in Babylon units.

However both linkOffsetX and linkOffsetXInPixels use pixels as a unit of measurement and I don’t want to use pixels since meshes will have varying sizes + pixels will behave differently on ipads and mobiles.

Here is a simple demo
https://playground.babylonjs.com/#41IFI5#29

2

Maybe @Evgeni_Popov has a nice idea for this :slight_smile: (disclaimer: I am still a GUI N00b)

3

Unfortunately you will have to update the linkOffsets manually as we do not provide other ways to move the links

The idea should be to project the mesh bounding box (with Vector3.Project). this will give you pixel informations on where the box is on your screen
Should be easy then to move the linkOffsets

1 Like
4

Thanks for clarifying that linkOffsets are in pixels ONLY.

1 Like
5

Hi Deltakosh, could you provide an example of how to use Vector3.Project? I am also trying to get the size of the mesh in pixels so I can dynamically determine (and change when the camera zooms in/out) of the linked GUI via its linkedOffsets. Unfortunately, being new at 3D and Babylon I am having trouble figuring out how to use Vector3.Project to get the size of the mesh in pixels…

Any help much appreciated!

1 Like
6

Hey @Matthew_Pflueger,

you can use Vector3.Project with the boundingBox.minimumWorld and .maximumWorld:

var min = BABYLON.Vector3.Project(minimumWorld, 
    BABYLON.Matrix.IdentityReadOnly, 
    scene.getTransformMatrix(),
    camera.viewport)

API doc: Vector3 | Babylon.js Documentation (babylonjs.com)

3 Likes
7

I think you forgot to call toGlobal() on the camera’s viewport, to convert it from normalized (0…1) width and height:

camera.viewport.toGlobal(engine.getRenderWidth(), engine.getRenderHeight())
8

Correct (I was doing it on my phone :))

1 Like