webVR-boilerplate, 支持webVR和移动方向支持的ThreeJS webVR样板

分享于 

4分钟阅读

GitHub

  繁體 雙語
A ThreeJS webVR Boilerplate with webVR and mobile orientation support
  • 源代码名称:webVR-boilerplate
  • 源代码网址:http://www.github.com/hawksley/webVR-boilerplate
  • webVR-boilerplate源代码文档
  • webVR-boilerplate源代码下载
  • Git URL:
    git://www.github.com/hawksley/webVR-boilerplate.git
    Git Clone代码到本地:
    git clone http://www.github.com/hawksley/webVR-boilerplate
    Subversion代码到本地:
    $ svn co --depth empty http://www.github.com/hawksley/webVR-boilerplate
    Checked out revision 1.
    $ cd repo
    $ svn up trunk
    
    eleVR webVR样板文件

    这是标准的基于threejs的模板,目前正在由团队团队使用。 它是基于网络的虚拟化体验的起点,使用了眼腔裂缝和智能手机+ phoneVR硬盘或者类似的耳机。 也有一个非VR回退,用于体验没有虚拟现实设备的内容。

    样板也有默认的游戏手柄和键盘控件。

    如果你想使用这个模板作为你自己的virtual项目的起点,请参阅本页底部的简短教程。

    数据绑定控件:

    点击( 或者轻按) 进入全屏VR模式。

    导航控件:

    • WASD + e/q 导航支持旋转。
    • 用于移动相机位置的箭头键导航支持。
    • 游戏手柄游戏杆导航控件。
    • 使用VR耳机或者移动电话进行方向控制。
    对文件的解释:

    index.html

    • 一个简单的html文件。
    • 默认情况下,它指向 demoWebVR.js,,它包含一个演示webVR体验
    • 你可以改变它指向 blankWebVR.js,,这是为了创建你自己的体验而明确注解

    demoWebVR.js

    • 一个基本的演示 THREE.js 体验被写入这个文件中,你可以将它作为。

    blankWebVR.js

    • 一个清晰的带注释的样板文件,可以添加代码来创建自己的webVR项目

    THREE.js ( three.min.js )

    • web helper 库,让你可以使用JS创建 web。

    PhoneVR.js ( 特别感谢 Andrew Lutomirski 获得帮助)

    • 检测是否使用具有方向的设备,并将电话方向数据转换为四元数。

    VRControls.js ( 来自MozVR版本的分支)

    • THREE.js 控件,它利用了 WebVR API。
    • 键盘控制
    • 游戏手柄控件
    • 获取phoneVR控件的phoneVR信息

    VREffect.js ( 来自MozVR版本的分支)

    • THREE.js 效果,在webVR或者手机上呈现两个摄像头时呈现场景,但只有一个相机全屏显示。
    WebVR基础教程
    • 为你的操作系统 1获得webVR浏览器( 我们推荐 Firefox 每晚)。 如果你要使用 Oculus,也可以得到适当的Oculus运行时
    • 如果你每晚使用 Firefox,请在浏览器中启用 webVR
    • 在地址栏中输入"关于:配置"
    • 使用搜索工具查找"vr""
    • 然后将" dom.vr.enabled"设置为 true""
    • 在webvr样板/js文件夹中编辑 demoWebVR.js 以创建场景。
    • 它有一些示例代码可以让你开始
    • 我们假设你将使用 three.js,的包装器来创建你的VR项目。 你可以在这里找到 THREE.js的一些优秀文档: http://threejs.org/docs/
    • 始终记住:Google是你的朋友 ! 3。或者更改 index.html 以在webvr样板/js文件夹中指向 blankWebVR.js,然后从头开始创建场景
    • blankWebVR.js 不包含任何示例代码,但是如果需要,可以始终交叉引用 demoWebVR.js。

    补充:设置你的计算机为主机服务,这使你能够做像试验和视频纹理和测试你的移动设备。 最简单最简单的可能是 python 简单服务器( 默认端口为 8000 ):

    % python -m SimpleHTTPServer [port ]

    确认

    这个样板是基于的模板的。

    It developed,help,,等众多成员的意见。帮助和贡献,已经得到了开发。


    WEB  SUP  Boilerplate  webvr  
    相关文章