Google VR VIEW FOR THE WEB

来源：互联网发布：b超三个数据看男女技巧编辑：程序博客网时间：2024/06/06 04:20

Google VR？
使用谷歌提供的VR View JS脚本可以将全景照片，视频等资源简单地展示在网站上。本文主要讲解如果通过谷歌的脚本实现图片的VR化。支持的格式
如上图VR View支持mono 和stereo 360两种图片。支持图片扩展格式为png, jpeg, gif。推荐使用jpeg来提高压缩。Mono图片推荐宽高比例是2：1 （如：4096：2048）Stereo图片推荐宽高比例是1：1 （如：4096：4096）素材准备
由于VR View会通过js请求图片资源，如果图片所处的服务器不支持跨域问题，会报请求错误。想通过代码体验效果的朋友可以将图片上传至七牛服务器或者使用下面现成图片# monohttp://ow4ffxtt1.bkt.clouddn.com/mono-360-1.jpghttp://ow4ffxtt1.bkt.clouddn.com/mono-360-2.jpghttp://ow4ffxtt1.bkt.clouddn.com/mono-360-3.jpg# stereohttp://ow4ffxtt1.bkt.clouddn.com/andes_512.jpghttp://ow4ffxtt1.bkt.clouddn.com/andes_2048.jpg
主要代码
    引入js文件
<script src="//storage.googleapis.com/vrview/2.0/build/vrview.min.js"></script>
    添加div节点
<div id="vrview"></div>
    添加VR View实例
        window.addEventListener('load', onVrViewLoad)        function onVrViewLoad() {            var vrView = new VRView.Player('#vrview', {                width: '100%',                height: '500',                preview: 'http://ow4ffxtt1.bkt.clouddn.com/andes_512.jpg',                image: 'http://ow4ffxtt1.bkt.clouddn.com/andes_2048.jpg',                is_stereo: true  //区分是mono还是stereo            });        }
本文相关代码
https://github.com/cangyan/TAV/tree/master/00001_VR_VIEW_FOR_THE_WEB参考链接
https://developers.google.com/vr/concepts/vrview

https://developers.google.com/vr/concepts/vrview-web查看原文：http://www.huuinn.com/google-vr-view-for-the-web/

阅读全文

0 0