-
🐡本站提供全面的VR全景视频、普通2D和3D视频是在线免费上传分享功能,支持免费在线直播。
-
🎈提供VR视频和普通视频直播技术支持
-
💓关注官方微信公众号“迷视VR资讯”,获取最新的VR咨询内容
-
🌼加入QQ群863363544与各路同行大佬交流行业技术心得
如果你不太了解web服务器或是初学者,查看例子前先搭建nginx服务器、windows用户找到 安装->nginx在windows安装,根据教程安装然后修改nginx.conf配置文件,指定当前项目目录为根目录,然后在浏览器地址栏输入localhost打开即可查看例子
#如果连带hls.js 和flv.js库,则添加 --recursive 参数 # (速度慢则可自行单独clone)
$ git clone https://github.com/guoguicheng/mxreality.js.git
$ cd mxreality.js
$ npm install
$ gulp build
<script src="./build/three.js"></script>
<script src="./build/mxreality.js"></script>
<!-- hls 直播(按需引入) -->
<script src="./libs/hls.js"></script>
<!-- flv 直播(按需引入) -->
<script src="./libs/flv.js"></script>
<div id='example'></div>
<script>
container=document.getElementById('example')
renderer = new THREE.WebGLRenderer();
container.appendChild(renderer.domElement);
scene = new THREE.Scene();
var vr=new VR(scene,renderer,container);
vr.init(function(){
})
vr.playPanorama('360.mp4',<vrType>);
// <vrType>播放类别:
// vr.resType.video 播放VR视频
// vr.resType.box 天空盒子模式
// vr.resType.slice 全景图片切片模式
// vr.resType.sliceVideo 全景视频分片模式或者是HLS直播模式
// vr.resType.flvVideo FLV直播模式
</script>
-
1、全景图片播放
-
5、全景图热点切换
-
6、热点鼠标点击事件
-
7、全景场景(飞鸟)
-
8、全景场景(模型)
-
10、全景场景(模型地球)
-
11、全景视频
-
12、热点图标设置
-
13、天空盒子
-
14、全景视频小行星视角初始化
-
15、全景MKV格式视频
-
16、全景视频
-
17、全景视频直播(HLS流)
-
18、全景视频直播(FLV流)
-
20、自定义流解码器
-
21、强制指定流解码器
-
22、混合现实(需摄像头支持)