Getting the Cesium-VR plugin to work with latest Firefox Nightly and Google Cardboard

Hellp World,
I have been trying to get the (now apparently abandoned) cesium-vr (https://github.com/NICTA/cesium-vr )
code working. I am finally trying to implement what Sean (from Mozvr team) suggested me about “single getEyeParameters call that returns a structure with the individual eye parameters as the fields eyeTranslation, renderRect, and recommendedFieldOfView” suggested in relation to the Head Mounted Display (HMD- Google Cardboard in this case) function calls.

I tried to make the corresponding changes in the https://github.com/NICTA/cesium-vr/blob/master/src/CesiumVR.js file where these parameters are accessed. In this light I made changes to lines (101-110):

            that.xEyeTranslation = {
      left  : that.hmdDevice.getEyeTranslation('left').x,
      right : that.hmdDevice.getEyeTranslation('right').x
    };

    // Holds information about the recommended FOV for each eye for the detected device.
    that.fovs = {
      left  : that.hmdDevice.getRecommendedEyeFieldOfView('left'),
      right : that.hmdDevice.getRecommendedEyeFieldOfView('right')
    };

I changed the lines to:
that.xEyeTranslation = {
left : that.hmdDevice.getEyeParameters(“left”).xEyeTranslation,
right : that.hmdDevice.getEyeParameters(“right”).xEyeTranslation
};
// Holds information about the recommended FOV for each eye for the detected device.
that.fovs = {
left : that.hmdDevice**.getEyeParameters(‘left’).recommendedFieldOfView**,
right : that.hmdDevice.getEyeParameters(‘right’).recommendedFieldOfView
};

But this does not solve all my troubles and I get trapped by an error from lines 188 and 195 where slave.frustum.setOffset is called. I have no clue what to do about these parameters since calls to slave.frustum.aspectRatio (line 186) are clearly supported.

I’d love to get this working since I believe VR is a great way forward and any help from the community would be really great. I promise that if and when I get this working, I shall create a fork of the code for other developers to work upon.

Thanks and Cheers!
Gaurav

Hi Gaurav,

Glad to see you’re looking into cesium-vr. Sorry it hasn’t been updated in a while, it’s been on my todo. I’ve been looking at it today and just pushed an update (https://github.com/NICTA/cesium-vr) which works with the latest version of Firefox Nightly with the VR enabler.

I think the problem you were having is because cesium-vr requires a frustum offset property that isn’t currently in Cesium yet (we have a pull request open to get this in though). That’s why the ‘setOffset’ function doesn’t exist. I’d recommend using the copy of Cesium provided with cesium-vr for now (I’ve just updated it to v1.9).

I’ve still got a few tweaks to add to cesium-vr but the changes I made today should get you up and running. Let me know if you have any trouble.

Cheers,

Craig

Hi Craig,
Thank you for making my day! It was slowly turning into a frustrating exercise getting it to work. It is such a promising bit of technology and I’d love to get into it.

I was able to get the code running on the mozvr nightly build both on my laptop as well as my Android device. I do not have access to an Oculus Rift and I was dreaming of making it work using Google Cardboard. Right now, on the mobile, I can just zoom and pan in absence of ways to input numbers. I’d love to get it into VR mode and explore it. Can you suggest any way I can go about doing that? Even getting one location to show up directly in VR mode would be awesome for starters.

Thank you for taking the time to respond.

Cheers,

Gaurav

Wow, great stuff Gaurav. Thanks for trying it on android. I probably won’t get a chance to look into this again until next Thursday, but if you want to go to a location on page load you could add the following at the end of the run() function in index.js just after showHelpScreen() call:

  setCameraParams(locations["49"], scene.camera);

  cesiumVR.levelCamera(scene.camera);

That will jump to the first location and level the camera. I’ve just made these changes and put them in a branch here if you want to have a play. This won’t go to full screen VR mode though. To enter VR mode, it needs to be because of some user input, the command cesiumVR.goFullscreenVR(container) (line 269 of index.js) initiates fullscreen VR mode but needs to be called “from inside a short running user-generated event handler”. If you could setup some recognised mobile event to initiate VR mode (a touch event perhaps), that will probably do the trick.

Let me know how you get on. I’ll get a chance to look into this properly next week.

Cheers,

Craig

Hi Craig,

Thank you for helping me out. I shall make it a point of making it work using touch event and be ready with something by the time you are back on Thursday.

Meanwhile, I have been trying to show normal cesium on a browser in Android. What enticed me was this sample on html5rocks website which, if run on a mobile browser, shows you how you can access the device orientation using native html5. I was able to create a sample, which when loaded in a browser (even chrome on Android is fine) takes you to a place in globe and moving the device around changes the orientation. I am attaching the file though I must caution that I have not figured out the correct way to link device orientation parameters with camera parameters. Turning the device orientation lock feature seems to cause problems so I could use some help. (To make the file vr5.html work, place it in your cesium root folder -mine is called MyCesium).

In this light, I was wondering why it is compulsory to have the dom-vr enabled. As far as I understand, cesium-vr is essentially two normal cesium views opened side by side (with some offset to let the eye focus), right?

Thanks again for being around.

Cheers,

Gaurav

vr5.html (3.64 KB)

Hello,

Gaurav im new using VR tools, but i would like to use the google cardboard with cesium, have you tried this? could you give me a hand to start connecting this, becaus using the VR plugin this ask me for HMD of occulus

Hello,

Cesium has VR support for google cardboard built in. See this demo: http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=Cardboard.html&label=Showcases

Click the VR button in the lower right corner to activate VR mode

Best,

Hannah

Hello Hannah,

Thanks for the answer, i have other question if youy could help me it would be awesome.

The example used a glb file (ballon model), do you know wich other formats of models Cesium support.

Cesium support obj files?

Cesium only has support for glTF models. glb is a compressed version of glTF
We host an online model converter to help you convert your collada or obj files to glTF though. You can find that here: http://cesiumjs.org/convertmodel.html

Best,

Hannah