In-game browser

Hi guys,

Just wondering if it is possible to create an in-game browser in playcanvas? Say after the player click a button, a small canvas appear in the right corner of the game that if you move your mouse over, you can start navigating around a certain website just like on the browser. Does anyone know how to do this?

Thank you!

You canā€™t really render a browser view in the the WebGL context but you can add an iframe to the page very easily.

Sorry, do you mean adding an iframe in game or to the webpage itself?

To the webpage. You canā€™t add an iframe to the ā€˜gameā€™.

Oh I see, so it is impossible to do that if we play in ā€œfull-screenā€ ?

Full screen just makes the webpage borderless so you can still add an iframe.

oh I see what you mean. So potentially I can let playcanvas send instructions to resize the canvas, then add the iframe to the webpage and launch the website in there?

Iā€™m not sure what you mean, can you draw an example?

So say if I want to have an in game purchase option for the game. The user can play and choose an item they like. Then I would like them to click on ā€œpurchaseā€, which will pop up the e-commerce website that let you purchase the item in real life. I can do make the website pop up that open another browser window for the buying aspect, but I would prefer the user experience to be smooth and easy, so preferable something that shown in game, or on the same webpage that the user is playing. What would you suggest is the best approach for this?

Standard practise is to have a popup window for this type of thing.

oh I see. Could you show me the line of code that I can use that happen after the user click on the button in game, it will pop up a new window from a website link?

https://www.quackit.com/javascript/popup_windows.cfm#:~:text=Database-,JavaScript%20Popup%20Windows,a%20new%20window%20in%20HTML).

Awesome! Thank you so much for your help! You are amazing!

1 Like