CODEWITHSUNDEEP
aframe
MarkusR
MarkusR

Reputation: 63

Aframe and aframe-ar: display video stream in div instead of fullscreen

I am using aframe-ar and need the video stream to be displayed in the same div as the scene is embedded to.

I am trying with the default scene:

<a-scene embedded arjs='sourceType: webcam; debugUIEnabled: false;'>
 <a-marker preset="hiro">
  <a-box position='0 0.5 0' material='color: black;'></a-box>
 </a-marker>
</a-scene>

The rendered box is successfully embedded in the surrounding div, but the video stream of my webcam is fullscreen and placed behind other html-elements.

I also tried to specify the camera explicitly but that did not help!

In short: I want to get the video also embedded in the surrounding div.

How can I do that?

Upvotes: 5

Views: 2836

Answers (1)

Piotr Adam Milewski
Piotr Adam Milewski

Reputation: 14655

ar.js spreads the camera feed on the entire body element. If you don't want to mess with the source code, You can contain it within an iframe:

<iframe src="myScene.html"></iframe>

Working glitch here.

Upvotes: 5

Related Questions