README.md

mxreality 读音 mix reality

免费软件，但受软件版权保护，尊重作者的成果，严格遵守协议内容并且保留播放器版权信息

• MXREALITY 混合现实网页版【QQ群：863363544】

• 在线文档

• 有问题可进入社区提问

• 查看官方例子在线地址

♨️商务合作请咨询

• 🐡本站提供全面的VR全景视频、普通2D和3D视频是在线免费上传分享功能，支持免费在线直播。

• 🎈提供VR视频和普通视频直播技术支持

• 💓关注官方微信公众号“迷视VR资讯”，获取最新的VR咨询内容

• 🌼加入QQ群863363544与各路同行大佬交流行业技术心得

• https://www.mxreality.cn

• 

如果你不太了解web服务器或是初学者，查看例子前先搭建nginx服务器、windows用户找到 安装->nginx在windows安装，根据教程安装然后修改nginx.conf配置文件，指定当前项目目录为根目录，然后在浏览器地址栏输入localhost打开即可查看例子

web引用

    #如果连带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>

npm引用

npm方式(react接入例子)

• 1、全景图片播放

• 2、全景图片小行星视角初始化

• 3、全景图片自动补天,带小行星视角初始化

• 4、全景图自动补天，转为天空盒子播放

• 5、全景图热点切换

• 6、热点鼠标点击事件

• 7、全景场景（飞鸟）

• 8、全景场景（模型）

• 9、全景场景（模型动画）

• 10、全景场景（模型地球）

• 11、全景视频

• 12、热点图标设置

• 13、天空盒子

• 14、全景视频小行星视角初始化

• 15、全景MKV格式视频

• 16、全景视频

• 17、全景视频直播(HLS流)

• 18、全景视频直播(FLV流)

• 19、全景视频直播(Dash流)

• 20、自定义流解码器

• 21、强制指定流解码器

• 22、混合现实(需摄像头支持)

• 23、混合现实（飞鸟）(需摄像头支持)