H5全景视频VR视频
公司的有个专题页面涉及到全景视频展示这个技术点，找到一个相关的库。
http://www.utovr.com/sdk/download 这里有个免费的SDK可以下载。
里面也有案例可以看，代码就照着引用就可以。
播放器的使用遵循简单实用的原则，只需3步操作即可完成配置。
1，文件引用：
将获取到的开发包文件(lib目录下的player文件夹)放置在Web项目的目录下，在html页面<head>标签内通过<script>标签引入播放器的引导js即可。
例如：
<!--引入引导js 动态下载播放器-->
<script language="javascript" type="text/javascript" src="./player/UtoVRPlayerGuide.js"></script>注意保证src的路径配置正确。
2，页面参数的配置:
<script language="javascript" type="text/javascript">
/*播放器参数配置*/
var params = {
container:document.body, //播放器容器Dom对象
name:"SceneViewer", //播放器名称
dragDirectionMode:true, //播放器拖动模式
width:800, //播放器的width
height:500, //播放器的height
/*fullScreenMode:true,//全屏模式 ===>如果是配置了该参数，将忽略width和height的配置，播放器将取当前窗口的尺寸作为播放器的初始尺寸*/
scenesArr:[
{sceneId:"test1k", sceneFilePath:"./panoVideo/960p.mp4", sceneType:"Video", initPan:0, initFov:100}
]
};
//sceneFilePath:为全景视频的路径配置，sceneType：场景类型配置
</script>3，页面播放器实例化：
<script language="javascript" type="text/javascript">
/*根据页面配置参数，实例化播放器*/
window.onload = function () {
initLoad(params);
};
</script>
做的使用插件的问题：
1、在H5页面中插入全景视频，最好是引用iframe插入，不然永远都在创建一个又一个新的播放器容器，消除不了；使用iframe后可以滑到下一页重新加载iframe。
2、H5插入一个局部全景视频，点击右下角全屏放大，再点击缩回去。依然还是通过控制iframe页面的width和height以及位置实现。
H5全景视频VR视频的更多相关文章
- VR视频外包公司（长年承接虚拟全景外包、虚拟现实视频外包）
承接VR视频外包(虚拟全景外包),虚拟现实视频外包(北京公司) 我们制作各类型VR全景虚拟现实,增强现实视频制作.录制等项目! 品质保证,售后完备. 我们团队成立于2011年10月,是一个专业从事严肃 ...
- VR视频原理
VR视频,这里指的是沉浸式全景视频,基本场景是观影者戴上显示头盔(如cardboard),在其中通过头部的转动可以看到全景视频的每个方向的图像.同时也能听到来自各个方向的声音,声音也会随着头部的转动而 ...
- Jaunt登陆索尼PSVR，为其提供大量VR视频
索尼PS VR自从推出就广受用户青睐,当然不仅仅是其低于高端VR头显的价格,还在于PS VR提供的丰富游戏内容.近日,国外视频网站Jaunt还专门为PSVR推出了专版APP,为其提供超过 150 个沉 ...
- 优分享VR开源啦，优分享VR是基于Google VR开发的一款手机VR视频资源的聚合软件
欢迎来到优分享VR开源项目 优分享VR 开源中国Git地址: http://git.oschina.net/xumingwang/youkes_vr 优分享VR是 优分享安卓APP VR视频播放开源部 ...
- 一张图看懂360°全景和VR的区别
2016年开始,Facebook.谷歌.腾讯.阿里等互联网巨头都已开始抢食VR(虚拟现实)这块的大蛋糕,虚拟现实发展速度惊人.在这样强势发展的背景下,一些产品也开始打着VR的幌子,挂着VR的噱头卖起来 ...
- 使用you-get下载视频网站视频或其他
使用you-get下载视频网站视频或其他 文/玄魂 目录 使用you-get下载视频网站视频或其他 前言 1.1 下载.安装 依赖 exe安装 pip安装 Antigen安装 Git 克隆源码 Hom ...
- 瑞蓝RL-NDVM-A16网络视频解码器 视频上墙解决方案专家--数字视频解码矩阵
瑞蓝网络数字视频解码矩阵(简称RL-NDVM)是依据第三代开放式网络视频监控系统的实际需求,专为视频上墙显示而研制的一款新型数字解码上墙设备.RL-NDVM解码矩阵是集解码器和HDMI/DVI/VGA ...
- VR全景加盟、720全景、VR全景技术平台-全国招商模式疯狂开始
VR全景:互联网与实体店的完美结合 VR元年已过,VR项目.VR创业潮转为理性,VR行业分为两个方向:硬件和内容.硬件又分为VR头显和辅助设备,内容又分为VR全景和VR虚拟内容,如游戏.娱乐.根据行 ...
- UWP 手绘视频创作工具技术分享系列 - 手绘视频与视频的结合
本篇作为技术分享系列的第三篇,详细讲一下手绘视频中结合视频的处理方式. 随着近几年短视频和直播行业的兴起,视频成为了人们表达情绪和交流的一种重要方式,人们对于视频的创作.编辑和分享有了更多的需求.而视 ...
随机推荐
- debian创建apt-proxy代理
由于公司网络比较慢.所以需要建立一个代理服务器或镜象站点!考虑到创建和维护镜象的投入比较大!所以选择apt-proxy代理来做!可以缓解公司带宽不足的矛盾.而且只有在代理缓存,没有相应组件的情况下才去 ...
- Java_spark简单例子
import org.apache.spark.{SparkContext, SparkConf} /** * Created by spark on 15-1-19. * 根据key对K-V类型的R ...
- C++_直接插入排序（纯C版）
//用于比较大小 int compared(const void *key1,const void *key2) { cout<<"enter compare"< ...
- Spark之路 --- Scala用JFreeChart画图表实例
JFreeChart介绍 JFreeChart是JAVA平台上的一个开放的图表绘制类库.它完全使用JAVA语言编写,是为applications, applets, servlets 以及JSP等使用 ...
- Android 高级UI设计笔记07：RecyclerView 的详解
1. 使用RecyclerView 在 Android 应用程序中列表是一个非常重要的控件,适用场合非常多,如新闻列表.应用列表.消息列表等等,但是从Android 一出生到现在并没有非常 ...
- Captcha生成及使用
@Controller @RequestMapping("/PictureCheckCode") public class ServletController { @Request ...
- 最短路径之Dijkstra算法及实例分析
Dijkstra算法迪科斯彻算法 Dijkstra算法描述为:假设用带权邻接矩阵来表示带权有向图.首先引进一个辅助向量D,它的每个分量D[i]表示当前所找到的从始点v到每个终点Vi的最短路径.它的初始 ...
- Class类中getMethods() 与getDeclaredMethods() 方法的区别
一:jdk API中关于两个方法的解释 1:getMethods(),该方法是获取本类以及父类或者父接口中所有的公共方法(public修饰符修饰的) 2:getDeclaredMethods(),该方 ...
- [改善Java代码]不推荐使用binarySearch对列表进行检索
对一个列表进行检索时,我们使用的最多的是indexOf方法,它简单好用,而且也不会出错,虽然它只能检索到第一个符合条件的值,但是我们可以生成子列表后再检索.这样也就可以查找到所有符合条件的值了. Co ...
- MapReduce中使用SequenceFile的方式上传文件到集群中
如果有很多的小文件,上传到HDFS集群,每个文件都会对应一个block块,一个block块的大小默认是128M,对于很多的小文件来说占用了非常多的block数量,就会影响到内存的消耗, MapRedu ...