PhotoSynth WebGL panorama viewer

November 1st, 2011 by Henri Leave a reply »

I’ve updated my PhotoSynth Downloader/Parser to be able to process Synth and Panorama as well. The network part of my PhotoSynth downloader was really ugly: I’ve rewrote it from scratch using libcurl. This version is really much faster and doesn’t crash anymore. But I’m a bit concerned about releasing the binary/source code. Allowing the download of a panorama created with an iPhone doesn’t bother me but it’s really different with gigapixel panorama (and my downloader can download both).

Live Demo (require WebGL enabled browser)

My implementation is very strait-forward: my PhotoSynthHDDownloader creates 6 jpg from a panorama url. The 6 faces of the cube are downloaded at full resolution. This solution is suitable for panorama created with an iPhone (low res) but not acceptable for gigapixel panorama (you need progressive download/display). I’m using Three.js as WebGL engine and I’d like to implement a megatexture solution to display very large panorama (I’ve found a very impressive working implementation and played with it: it is working with Google Chrome / Firefox 10).

To be able to handle panorama as well, my Google Chrome extension needs to use megatexture and it would be really more efficient if Microsoft could add the missing cors header to allow WebGL cross-origin (even only for And as they’ve just moved their data to Windows Azure, I guess that it may be easier to add this header ;-) . Otherwise I’ll have to use my special trick to bypass webgl same-origin-policy restriction.



  1. Henri, fantastic!

    I’ve been hoping you’d add panorama downloading, but didn’t think it would happen now that you have a full time job. Hopefully you will feel free to upload the binary to the PhotosynthToolkit page.

    Your WebGL viewer is looking sharp! A little momentum would be appreciated, but it’s solid and quick, so good work. I’d like to be able to try it on any synth/pano a bit easier, but I suppose that will come in time.

  2. I’m sorry to post an off-topic comment, but have you previously mentioned Changchang Wu’s VisualSFM?

    I recently came across it on YouTube and it looks promising:

    I’m curious what your thoughts on it are, speed-wise.

  3. Henri says:

    @Nate: To be able to display the photosynth pano/synth (with thumbnail) I need:
    - to implement a megatexture solution (to handle the progressive download/display)
    - Microsoft to add missing cors header (otherwise displaying thumbnails would be very slow: javascript would have to decode JPEG).
    - Microsoft to give me some insight about undocumented json parameters.

    Concerning VisualSFM: it is really better than Bundler! Although the Bundler version packaged with PBA is really fast too. On the technical side, I have some remarks:
    - IMO the big missing feature of VisualSFM is a linear unstructured matching (as OpenSynther does) -> matching would be linear not O(n²).
    - I found a strange memory policy for the feature extraction process (all image are loaded in memory before GPU processing?)
    - for the dense reconstruction, well I just can recommend acute3D technology instead of CMVS/PMVS as I’m working at acute3D ;-)

    BTW, do you have seen our demo of PhotoSynth -> acute3D?

  4. PAblo says:

    acute 3D is looking trully amazing. The big con is that is more marketed to big projects rather than individuals and this leaves us out of the game. Anyway, if you guys find a moment to play, this scene I made might drop interesting results.

    I already sent to acute via youtube. Just so you have the link too.

  5. Henri says:

    @Pablo: I was going to point you to 123d catch but I guess that you’ve already find it by yourself ;-) . We are obviously not producing model for free at acute3D but if you’ve a project for this reconstruction you can contact us directly via: acute3D contact page.

  6. Pablo says:

    Hi there. Yess it works perfectly with “small” sized stuff, rocks cars etc… photographed “around”. My project is not for that particular building, that was just a teste, I’m building a racing games, and for building I’m considering an image based modelling solution. At this stage I dont yet feel the presure to find a solution for the buildings, but I keep testing to see what the way could be. Once arrived the moment, if I still havent found a solution by myself I’ll contact. You cant anyway use my synth to test your soft. I dont want the model, but if you process it, an screenshot would be interesting.

  7. Pablo says:

    sorry for that horrible spelling.

  8. Henri, sorry to keep asking about panorama export, but I’m wondering how difficult it would be to save a panorama’s tile pyramid and only make whatever changes are necessary to load it into HDView as we can our own panoramas from ICE when exporting to a Deep Zoom Tile format. (My assumption is that this is very closely related to what Photosynth is already using.)

    I would also be interested in a tool that automatically converts a panorama hosted on Photosynth’s servers to a QuickTime VR panorama.

    I have had two separate people ask on the Photosynth forum about how to save their panoramas’ cube map to view offline.

    The first wanted to then convert it to work with other viewers.

    The second simply wanted to view their iPhone panoramas offline on their own computer.

  9. Henri says:

    @Nate: panorama are indeed stored using the same deep zoom format (one image per cube face). But I don’t think that I’ll be releasing the exporter because I’m concerned about the possibility of exporting gigapixel panorama… My exporter could be used to steal panorama created with an iPhone or ICE which is not fine for me!

  10. Eek says:

    Hi Henri :)

    Got a question maybe you can help me :) I really like the webGL rendering of three.js, and I was wondering what’s the easiest way to add an hotspot (for example on the door) to this exemple:

    Waiting forward for you reply :)

    Thanks in advance!

  11. Henri says:

    @eek: You need to place a 3d plane in the scene. I’m sorry but I don’t have a lot of free time to create an example. I’m working on another webgl related project using to load very big model.

  12. Eek says:

    Have any ideea where I can find some code example of setting a 3D plane to stay in the same place?

    All i want is a white box to stay somewhere on the image :)

Leave a Reply