Click on GUI.StackPanel or GUI.Image to open URL

Questions
1

Hi! I’m trying to allow an image or stackpanel to be clickable such that it opens a new URL. Essentially I want to do something like <a href="my_url"><img src="image_url" /></a>.

From what I’ve found on the documentation is that I can use an actionManager on a mesh:

var cylinder  = BABYLON.MeshBuilder.CreateCylinder(index, {radius: 0.5, height: 0.2}, scene);
cylinder.actionManager = new BABYLON.ActionManager(scene);
cylinder.actionManager.registerAction(
  new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnPickTrigger,
    function (event) {
      var pickedMesh = event.meshUnderPointer;
      window.location("http://doc.babylonjs.com/");
    })
)

However, it seems like I can’t put an actionManager on an image or on a StackPanel. Could anyone advise how I can do this?

2

Picking is for regular meshes, not for 2D GUI.

For GUI controls, you can use the onPointerXXXObservable properties to react to inputs:

https://doc.babylonjs.com/how_to/gui#events

1 Like