我正在尝试使用Three.js渲染来自360鱼眼投影的360视频(仅举例说明这是什么类型的投影:http://www.huwpenson.com/wp-content/uploads/2014/03/FISHEYE-15.jpg)
现在,我已成功使用等角投影渲染360个视频。但我无法弄清楚如何在Three.js上设置投影类型
以下是360视频播放器的基本代码:
var container, mesh;
container = document.getElementById( 'container' );
camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 1100 );
camera.target = new THREE.Vector3( 0, 0, 0 );
scene = new THREE.Scene();
var geometry = new THREE.SphereGeometry( 500, 60, 40 );
geometry.scale( - 1, 1, 1 );
var video = document.createElement( 'video' );
video.width = 640;
video.height = 360;
video.autoplay = true;
video.loop = true;
video.src = "textures/pano.webm";
var texture = new THREE.VideoTexture( video );
texture.minFilter = THREE.LinearFilter;
var material = new THREE.MeshBasicMaterial( { map : texture } );
mesh = new THREE.Mesh( geometry, material );
scene.add( mesh );
renderer = new THREE.WebGLRenderer();
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setSize( window.innerWidth, window.innerHeight );
container.appendChild( renderer.domElement );