Research And Implementation Of Indoor Panorama Roaming Based On WebGL

Panoramic roaming is a hot research in recent years.We can use panoramic roaming technology to build a 3D scene so that the users can walk in the virtual space as he or she in reality.Panoramic roaming technology use acquisition of panoramic images,and then use graphics technology to capture the picture into a panoramic scene space,allow users to change the direction of the line of sight,and look around,as if in a reality.This paper is mainly based on the Three.js to realize the indoor scene roaming in the browser,and introduces the Surf algorithm to improve the distortion in the panoramic image splicing before the panoramic scene is built.The research contents of this paper are as follows:(1)Study the theory of WebGL,as well as the basic theory of coordinate system,grid,material,camera and so on in 3D graphics,understand the principle of the construction of3 D scenes in broswer.(2)Preprocess the images and compare the Surf and Sift algorithms.For panorama splicing in this paper,we choose the Surf algorithm to process the edge pixel of the spliced part in the image to make the transition of the edge more natural.(3)Research and compare several existed frameworks to build 3D scene,use Three.js to build our 3D scene finally.Import an existed Maya scene model to create an overall preview of your home's architecture and then build a separate scene.(4)This paper realizes the virtual scene roaming.After building all the scenes in the house,add interactive events in the scene.By clicking a point in the scene with the mouse,the scene will be magnified to achieve the goal of approaching or moving away from the scene.When clicking to the edge point,It will switch to the next adjacent scene.(5)In order to be compatible with the Webview in mobile phone,this paper also studies to switch the scene by adding touch events.This study shows that the images preprocessing and the Surf algorithm which can solve a series of problems brought by the image splicing process well and improve the discontinuity of the panorama picture for the splicing edge processing.In the end,the Three.js framework is used to the implement of panoramic scene roaming in the browser.