The example on right uses an equirectangular image in Aframe as a static panoramic background. In this learning resource we will address the generation of equirectanglar 360 degree videos in a 3D modelling environment for the web. In the first example we assume to have double fish eye input video that are converted into equirectangular video as living background.
Sequence of rectangular Images back into 360 degree video
These steps are explained in details and see video tutorials for further detail.
(Convert Video into Sequence of Images with FFmpeg) Decompose the 360 degree double fish eye video into single images. One image per frame can be created with ffmpeg with the following command. To decompose an MPEG2 file to individual frames you would use ffmpeg on the command line of your Linux, MacOSX or Windows computer. ffmpeg is Open Source software, which is used according to the Open Community Approach
ffmpeg -i inputfile.mp2 -f image2 image-%07d.png
The code produces PNG images image-01.png, image-02.png, ... as frames of the video. With 25fps (frames per seconds you will get 25 image per second of the video.
(Convert Double-FishEye Image into Equirectangular Image) Load one image/frame into Hugin to define the projection of the two fisheye camera images on a sphere. The result is a equirectangular image which should be tested in Aframe as 360 degree background and a mapping, that can be used to convert all the other images (frames of the video) with the same projection. This can be done because the all frames with two fish-eye camera images on it can be converted with the same stitching method for the spherical background. As you might have noticed that dual fish-eye videos with 25fps (frames per seconds you produces 25 image per second for your video. Manual stitching for so many files is not appropriate workflow. This process can be automated with panotoole. You perform the stitching one with Hugin and your create a pto file, that can be used for multiple dual fish-eye images
(Convert Sequence of Images into Video with FFmpeg) The list of all equirectangular images are combine into a video. This video is the background video of Aframe and replaces the static image background by a MP4-video.
(Add Spherical Video Background 3D Model) The last step is the integration of the MP4-video as Aframe Video background.
There are cheap 360 degree cameras on the market that are able to create equirectangular images directly with the camera. But the recorded videos are double fish eye cameras. To use the MP4 video source of these cameras as equirectangular background videos in Aframe, it is necessary to convert the double fish-eye video into an equirectangular MP4 Video.
Youtube Example of National Parks - published by Google, select Fullscreen in Youtube Video and use the cursor buttons in the top right to look around in the video.
Valiant 360 Degree Video[1] - See top video on the website and drag mouse to look around. Furthermore it contains a repository to create your own 3D videos. Learn how to create the video with Hugin (see also IEEE Viewport-adaptive navigable 360-degree video[2]).
↑Corbillon, X., Simon, G., Devlic, A., & Chakareski, J. (2017, May). Viewport-adaptive navigable 360-degree video delivery. In 2017 IEEE international conference on communications (ICC) (pp. 1-7). IEEE.
Youtube Example of National Parks - published by Google, select Fullscreen in Youtube Video and use the cursor buttons in the top right to look around in the video.