Skip to main content

Creating a scene

Once you’ve finished installation, you’re ready to stream.

1. Get a viewer key and asset ID​

2. Create the scene​

With your viewer key and asset ID in hand, you’re now ready to stream. Simply add a <miris-scene> and <miris-stream> to your HTML:

index.html
<miris-scene viewer-key="VIEWER_KEY">
  <miris-stream uuid="ASSET_ID"></miris-stream>
</miris-scene>

3. Position the stream​

You’ve added your stream to the scene, but it might not quite look right. That’s because by default, both the stream and the camera are initialized to the scene origin, (0, 0, 0).

You can fix this by positioning your stream in front of the camera. The camera looks down the negative Z axis, so you’ll need to set the Z value of the stream’s position to a negative number:

index.html
<miris-scene viewer-key="VIEWER_KEY">
  <miris-stream uuid="ASSET_ID" position="0 0 -5"></miris-stream>
</miris-scene>

Every stream is different, so try adjusting the Z value of the stream’s position to find what looks best. The dimensions of some streams are quite large, so you may need a Z-value in the hundreds or even thousands for the best result.