I’m new to Babylon.js and I’m trying to figure out why my code isn’t working.
Here is my playground: https://playground.babylonjs.com/#QVM5WW#12.
I need to create a GUI window with a title, an image, and a description. I need to be able to open a link when I click on the image or the title. The problem is that I always get the error “window.open is not a function”.
Is there a bug with the onPointerUpObservable.add function?
Do you have any idea why my links won’t open when I click on my title or image? Thanks so much for your help
‘window’ in the click observable is referring to the GUI element, and you want it to point to the global window to open the link.
I renamed the GUI element window2.
This seems to be an issue with Rectangle as parent, because its a GUI Control and not a GUI Container. I guess it doesn’t check children pointer events. @carolhmj may confirm?
My solution would be to use GUI Container like StackPanel or Grid as parent.
I think I can safely answer “NO”. First of all, the rectangle is a container and second it doesn’t prevent any pointer actions for the children.
I had a quick look this morning and wanted to modify and reply but then I got cought having to do some other stuff In any case, I believe there was something with the entire set-up being wrong. It might also have had TB’s covering the image. Where a textBlock by default IS a pointer blocker.
Edit: OK, so just quickly for the debug, it is the description textBlock blocking pointer action on the image.
Then, as I said, the way this thingy is done and imbricated is kind of well, not ideal.
My advise would be to create a grid and/or create a container (either a rectangle or a stackpanel) to host the textBlocks. The loose text blocks in a (dynamic) layout are a pain as they do not stack and can extend and stuff with wrapping and stuff. I would try to avoid this to keep control of the layout. Of course, my opinion only and I hope this helps. Meanwhile, have a great day
Edit1: I quickly did here a rush for one of the possible layout using a grid. Sorry, I didn’t do it through functions. It’s faster to do it straight forward. The purpose here is to show you how you should imbricate your containers and controls in order to keep some sort of control and consistency.
The other option for this layout that may be even more convenient and more dynamic would be to use stackpanels. When using stackpanels, you will want to constrain each control (image and textblock) in a stackpanel. The good thing is that you can have the stackpanel extend from the content of your text and all panels (containers and controls) below will follow. The grid (as shown in the PG above) is more appropriate to constrain everything in a rather ‘fixed’ layout.
In any case, I believe there was something with the entire set-up being wrong. It might also have had TB’s covering the image. Where a textBlock by default IS a pointer blocker.
