Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Dec 2011
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How would i go about this?

    Hi there. I want to make a site that is basically the interior of a pub / bar. The user can move 360 degrees around the bar to look at the various features, placed in points off interest will be various icons which when clicked will open a small div element and just provide a little text. How would i go about doing this and what would be the best tools to use?

    From the limited knowledge I'm guessing i'd want to take lots of photos to compile one large image of the entire place? I'm thinking just doing it all in HTML5 would be my best bet?

    Any help or advice would be much appreciated.

    I'll try and find an example of what I'm talking about to make it clearer too.

    Thanks

  • #2
    New Coder
    Join Date
    Dec 2011
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    So a bit like this site but rather than just being in one small box I want it full screen..

    http://www.360cities.net/


    Ideally if possible I want to be able to give the user to move closer to either end of the bar too.

  • #3
    Regular Coder patryk's Avatar
    Join Date
    Oct 2012
    Location
    /dev/couch
    Posts
    398
    Thanks
    2
    Thanked 64 Times in 64 Posts
    first of all you'll need 360 degrees panoramic photo for each point of view you want to use.
    there are some scripts to view those like this: http://www.cheetah3d.com/download/HTML5pano/index.html
    i seriously doubt you'll find something custopmizable enough to put there your little popups and stuff like that.
    you know it's not that easy. you need real-time geometry correction for each frame, so for something like that to work smoothly on averge computer it will need to be really well optymized.
    you'll either code it yourself or you'll pay quite a bit for it.
    also to shoot good panorama (especially if you want to be able to zoom it in, you'll need decent tripod with panoramic head(camera needs to rotate exactly around nodal point to keep perspective). i'm a photographer and i can tell you those aren't cheap.
    just to show you basic viewer for those: http://www.openstudio.fr/jquery.spherical.panorama/
    it takes forever to load and it's not even close to full screen
    here's one good guide how to make that kind oh photos: http://www.lightspacewater.net/Tutor...toPano2/paper/
    it's interesting project tho. i might be even interested in collaborating on that one
    PM me

  • #4
    Regular Coder Custard7A's Avatar
    Join Date
    Jul 2010
    Location
    Australia
    Posts
    286
    Thanks
    32
    Thanked 33 Times in 33 Posts
    The canvas element can be good for getting really tricky, with a ton of Javascript as well. However, the site you linked simply uses Flash, as does Google site-maps, from what I see. That might be the better option.

    One more consideration I would throw in there is usability. The majority of people are turned off by web pages with excessive interactivity, load times, and poor navigation. Personally, I wouldn't frequent a website where I had to drive around with mouse gestures and load massive images, even if I was initially impressed. Likely many people feel the same.
    Last edited by Custard7A; 10-30-2012 at 02:20 AM.

  • #5
    New Coder
    Join Date
    Dec 2011
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Okay, cheers for the info.

    I guess 360 degree wouldn't be needed, as being able to see all the floor and celling space is pretty pointless as there's not much to look at.

    So would it be any easier if the images was one long level image (an exceptionally long panorama), as to allow the user to only move in one plane (left and right).

    As for the usability issue that Custard7A pointed out. This site is only going to be viewed by a very limited audience and only on a handful (if not one) occasions, so loading times etc.. aren't too much of an issue.

    Cheers

  • #6
    Regular Coder patryk's Avatar
    Join Date
    Oct 2012
    Location
    /dev/couch
    Posts
    398
    Thanks
    2
    Thanked 64 Times in 64 Posts
    in that case u can just use your panorama as a backgroung for div and animate background-position propertu using jQuery. taht would be prolly easiest aproach


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •