User Tools

Site Tools



This shows you the differences between two versions of the page.

Link to this comparison view

Next revision
Previous revision
Last revision Both sides next revision
layarmmo-poi [2012/05/14 11:49]
matthewleach Content moved here from basic layer page
layarmmo-poi [2012/08/29 12:03]
matthewleach Added description text.
Line 1: Line 1:
-Add a hotspot/Point of Interest+===Add a hotspot/Point of Interest== 
 +Time to add a "hotspot" This is how you place something in the environment.  Each will have its own unique ID, which you set yourself, and various other optional settings.  The snippet of code below, shows the mandatory parameters.  If you visit the [[|API page]], then the structure graph at the top of the page shows mandatory parameters marked with an asterisk.  Note that the parameters can be empty - you just need to include them for each hotspot.
 <code php> <code php>
Line 8: Line 10:
     "hotspots": [     "hotspots": [
         {         {
-            "id": "28",+            "id": "01",
             "anchor":{             "anchor":{
      },      },
Line 22: Line 24:
 </code> </code>
-Positioning in space+===Positioning in Space=== 
 +The code above is missing a very important part of Augmented Reality - the position.  At this point I'll briefly introduce the "GetPOIs Request" Essentially the Layar app tries to send information to your server so that you can load the right thing.  If you're familiar with web development, then these parameters are sent as GET variables.  Two parameters that are sent are the **latitude** and **longitude** (location) of the phone.   
 +Here we add 0.00003 to the latitude to move the hotspot roughly [[|3.33 metres]] north of wherever the phone is.  Note that this doesn't work for the longitude because of the Earth's shape, but more on that later. 
 +Layar supports two types of anchors - either a geo-location (latitude and longitude), or relative to a reference image. You can no longer mix the two types in the same layer, but we only need geo-locations.  We can also add a title in the text section so that our hotspot has a name. 
 <code php> <code php>
 <?php <?php
-$latitude = $_GET['lat'] + 0.00001;+$latitude = $_GET['lat'] + 0.00003;
 $longitude = $_GET['lon']; $longitude = $_GET['lon'];
Line 53: Line 61:
 </code> </code>
-Full layer with an image+===Displaying an Image=== 
 +If you view the layer above in the Layar app, then you will see an icon floating in space.  In some applications that's all you need, but we'll place an image floating in space instead. 
 +For this we'll add an **object** parameter.  Again, from the the [[|API site]] we can see that if you include an object parameter, you must also provide contentType, url, and size.  URL is the location of the image on the Internet (probably you're own server), and size is the real-world height of the object.  The contentType parameter is probably the most confusing at first, but basically there is a specific bit of text to say if it is an image, or a 3D model etc. - in this case a png.  More information can be found [[|here]].
 <code php> <code php>
Line 89: Line 101:
 </code> </code>
-Add the transformation to make it always face you.+===Transformations=== 
 +Another very useful set of parameters are for transformations.  These allow you to reposition and rotate the object (you can just set the scale using the size parameter of the object).  Shown below is some code that you can add underneath the object definition in order to rate the image so that it is always facing the viewer.  Otherwise you might sometimes be side-on to the image and not be able to see it.
 <code> <code>
Line 108: Line 122:
 } }
 </code> </code>
 +This section shows you how to add an object to your hotspot, and position it in the environment.  If you can get an image of a monster, then with this code you can have them appear in front of you.
layarmmo-poi.txt · Last modified: 2012/11/07 17:00 by matthewleach