nunuStudio是一款支持 3D 以及 VR 應(yīng)用的 three.js 框架，可以直接在瀏覽器上運(yùn)行，不需要使用 WebGL 和 WebVR 等額外的插件。它提供了一個(gè)可視化的場(chǎng)景編輯器、代碼編輯器、可視化工具來(lái)編輯紋理、材質(zhì)、粒子發(fā)射器等等。

宗旨為：“3D content that runs everywhere！”

特性

• 可視化應(yīng)用程序編輯器
• 基于three.js
  
  • 支持實(shí)時(shí)照明和陰影映射
  • three.js 代碼可以在 nunuStudio 腳本中使用
• 支持各種文件格式
• 支持 TTF 字體
• 可直接拖拽文件到對(duì)象
• NWJS 和 Cordova 用于簡(jiǎn)單的桌面和移動(dòng)設(shè)備部署
• 物理引擎(cannon.js)
• SPE 粒子系統(tǒng)
• 支持微軟的 Kinect 和 Leap Motion
  
  • 微軟的 Kinect 僅支持 Windows 項(xiàng)目
• 兼容 WebVR 1.1

案例

運(yùn)行

• nunuStudio 應(yīng)用程序在 web 頁(yè)面中使用
• web 網(wǎng)頁(yè)上 nunuStudio 的嵌入式應(yīng)用程序可使用如下代碼
• 全屏然后使用 VR 默認(rèn)按鈕，nunuStudio 可導(dǎo)出整個(gè)頁(yè)面的 web 應(yīng)用程序。

var app = new NunuApp();
 app.setCanvas(canvas);
 app.load("app.isp");
 app.run();

 //On exit callback
 app.onExit(function()
 {
    //TODO <Exit callback>
 });

 //Resize app
 function resize()
 {
    app.resize();
 }

 //Toggle fullscreen
 function toggleFullscreen()
 {
    app.setFullscreen();
    app.resize();
 }

 //Toggle VR mode (if available)
 function toggleVR()
 {
    if(app.vrAvailable())
    {
        app.toggleVR();
    }
 }

技術(shù)

nunuStudio 使用了許多開(kāi)源項(xiàng)目：

• NWJS
  
  • nwjs.io
• three.js
  
  • github.com/mrdoob/three.js
• opentype
  
  • opentype.js.org
• SPE
  
  • github.com/squarefeet/ShaderParticleEngine
• Cannon.JS
  
  • schteppe.github.io/cannon.js
• JSColor
  
  • jscolor.com
• CodeMirror
  
  • codemirror.net
• LeapJS
  
  • github.com/leapmotion/leapjs
• JSHint
  
  • jshint.com
• YUIDocs
  
  • yui.github.io/yuidoc

更多內(nèi)容，詳見(jiàn) Github：https://github.com/tentone/nunuStudio