带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(9)

简介: 带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(9)

带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(8) https://developer.aliyun.com/article/1243471?groupCode=taobaotech




等角度立方体投影格式的全景视频原始画面(文字方向都是基于旋转后天空在上、地面在下、画面方向正常的情况标注的):


image.png


观察截图可以发现,画面上半部分即为面向前方时的横向(左右)扫视图,下半部分逆时针旋转 90° 后即为面向后方时的纵向(上下)扫视图。


从投影质量、投影效率和带宽来进行对比,EAC 是三者中最优的。但由于历史和易于展示/编辑的原因,市面上摄像设备普遍产出的是 ERP 投影的全景视频。


在新零售工作台上,商家上传的是 ERP 投影的全景视频,上传后内容中台将转换为 EAC 投影来供手淘进行渲染播放。我们的封面视频生成环节是在商家的上传流程中,因此需要渲染的是 ERP 投影的全景视频。


3D 渲染基础知识


了解完投影的方式,接下来看如何实现投影。这部分涉及到一些 3D 渲染的基础知识。


想在屏幕上展示 3D 物体,大体上的思路是这样的:


1. 创建一个三维空间,称之为场景(Scene)

2. 确定一个观察点,并设置观察的方向和角度,称之为相机(Camera)

3. 在场景中添加供观察的物体(Objects),物体有网格(Mesh), 线(Line), 点(Points)等

4. 最后我们需要把所有的东西渲染到屏幕上


下面来具体看一看这些概念。


场景


场景(Scene)是所有物体的容器,也对应着我们创建的三维世界。


相机


相机(Camera)就相当于我们的眼睛,为了观察这个世界,我们需要描述某个物体的位置。描述物体位置需要用到坐标系。常用的坐标系有左手坐标系和右手坐标系。


image.png


常用的有两种相机,正投影相机(OrthographicCamera)和透视投影相机(PerspectiveCamera):


image.png


上面左图是正交投影,物体反射的光平行投射到屏幕上,其大小始终不变,所以远近的物体大小一样。在渲染一些 2D 效果和 UI 元素的时候会用到;右图是透视投影,符合我们平时看东西的感觉,近大远小,经常用在 3D 场景中。



带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(10) https://developer.aliyun.com/article/1243469?groupCode=taobaotech



相关文章
|
前端开发
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(4)
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(4)
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(4)
|
JavaScript
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(12)
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(12)
|
算法 前端开发 API
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(6)
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(6)
108 0
|
存储 算法
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(2)
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(2)
|
新零售
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(3)
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(3)
|
编解码 算法
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(7)
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(7)
|
前端开发
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(15)
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(15)
106 0
|
编解码
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(8)
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(8)
112 0
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(14)
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(14)
|
存储 JavaScript 前端开发
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(11)
带你读《2022技术人的百宝黑皮书》——全景封面视频生成技术在淘宝的应用(11)
127 0