如何在as3/away3d中設置一個360視頻投影，以保持覆蓋圖的直線

Question

我正在嘗試構建一個360度視頻播放器，這個視頻播放器或多或少會像Youtube的桌面360播放器那樣動作。我不是一個3D人，但我已經設法用我在網上找到的代碼構建了一些東西。我爲此使用Away3D 2.5.2。

我遇到的問題是我的客戶端在視頻上粘貼了一些圖形疊加層。這些覆蓋物必須保持平直，至少在垂直方向上。儘管YouTube的播放器成功地保持這些直 - 在這裏看到：https://www.youtube.com/watch?v=59MVhZWlKgQ - 我自己的球員曲線的垂直線位 - 在這裏看到：http://www.ysection.com/saar/360a/

視頻本身是在這裏： http://www.ysection.com/saar/360a/360test2-injected.mp4

*這段視頻只是一個例子只有這個問題。我在YT上發現它，並且我沒有權利

正如你在這些screengrabs中看到的，Youtube的播放器有一些補償性的「魚眼」失真應用於視頻（見邊緣），這有助於保持直線。

無論玩家玩相同的視頻這是4096x2048等距離長方圓柱視頻。

下面是關注問題的主要代碼：

這是我如何設置攝像機：

camera = new HoverCamera3D(); 
camera.steps = 1; 
camera.zoom = 15; 
camera.focus = 25; 
camera.minTiltAngle = -90; 
camera.maxTiltAngle = 90; 
camera.panAngle = 270; 
camera.tiltAngle = 0; 

這是材質設置：

video = new Video(2880,1440); 
vBitmap = new BitmapData(2880,1440); 
skyMaterial = new BitmapMaterial(vBitmap); 
skyMaterial.smooth = true; 

這是3D對象設置：

skysphere = new Sphere(); 
skysphere.material = skyMaterial; 
skysphere.radius = 2800; 
skysphere.rotationX = 180; 
skysphere.segmentsW = 40; 
skysphere.segmentsH = 36; 
skysphere.scale(-1); 
scene.addChild(skysphere); 

，這是我在輸入框：

vBitmap.draw(video,null,null,null,null,true); 
if (move) { 
    camera.panAngle = 0.3 * (lastMouseX - this.mouseX) + lastPanAngle; 
    camera.tiltAngle = 0.3 * (lastMouseY - this.mouseY) + lastTiltAngle; 
} 
// hack 
camera.panAngle = camera.panAngle+0.001-0.002*int(hackSwitch); 
hackSwitch = !hackSwitch; 
camera.hover(); 
view.render(); 

你們是否有關於如何讓我的球員的行爲像YouTube對我有什麼建議？

感謝， Sa'ar

Answer 1

我需要看看這個在後面，但在第一種觀點：

看來YouTube正映射視頻封頂汽缸內（即相機固定在'膠囊'內的0,0,0）。如果您使用覆蓋層朝屏幕邊緣向上/向下平移，覆蓋層垂直線保持筆直，傾斜於平移量，當然是筆直而不是凹面。由於您可以向上/向下平移180度，因此如果您在導體的腳處向下平移，您將看到線條如同映射到球體一樣收斂，但在0度平移中，您正在查看映射到因此氣缸的垂直「壁」因此不會在覆蓋層的垂直線上發生變形。

取代3D映射到Away3d中的球體基元，請嘗試使用away3d.primitives.CapsuleGeometry代替作爲快速入侵。通過客戶webgl着色器，Google可能確實在做一個真正的「Rectilinear Len」，或者也許只是映射到一個直線網格（再次映射成一個膠囊的形狀？），但每個網格之間的距離不一致水平段來提供直線外觀和感覺，但我沒有看過js代碼。

注意：對YouTube播放器進行快速測試，在地板和天花板附近繪製一些方形疊加層，然後播放並向上或向下平移以查看失真開始的位置。儘管如此，只需在視頻上疊加網格線（即像磚牆一樣），以覆蓋整個垂直高度和視頻的整個水平寬度，然後您就可以通過平移「映射」他們正在使用的原始對象類型當其中一條線旋轉0°時，上下偏移90°偏離中心（同樣，我假設它將顯示具有球形帽或直線立方體的圓柱體或具有基於蝙蝠/均等性的頂點幾何體的球體）。