CODEWITHSUNDEEP
javascriptwebglwebvraframe
ngokevin
ngokevin

Reputation: 13233

How do I display <iframe>s as a texture in A-Frame?

I want to display webpages as 2D content with a VR scene. Can I use an <iframe> element as a source for a texture in WebGL/three.js in https://aframe.io?

Upvotes: 5

Views: 4779

Answers (2)

ngokevin
ngokevin

Reputation: 13233

No. Currently as a limitation of the browser, <iframe>s can not be displayed within A-Frame, used as a texture, or be mixed with WebGL or WebVR.

While it is possible to overlay an iframe on top of the scene, it won’t display properly in stereoscopic mode (VR) with proper distortion, and it won’t be properly shaded.

Upvotes: 3

user128511
user128511

Reputation:

You can't use iframes or any other HTML element inside WebGL as it would be a security risk. People could read passwords and other private info from the textures.

you can however find creative solutions like this one which is the first hit of googling "iframe webgl".

You do it by putting a iframe behind a webgl canvas, using 3d math cut a hole (draw transparent pixels) where you need the iframe to show through by using a 2d plane that represents the iframe. Then use 3D css to position the iframe element to match the plane.

Upvotes: 7

Related Questions