LBS Quickstart: Indoor Location-Based

Scan this marker with
junaio to see what you are
getting in this tutorial.

What should you have done by now?

Prompt to Scan
Indoor Navigation
  1. You should have followed the "Hello World POI" – Tutorial
  2. You should have followed the "Location-Based 3D Objects" – Tutorial or "Animate your T-Rex" – Tutorial
  3. You should have followed the "Stick it on the screen" - Tutorial

What will you learn?

Scan the QR Code on the right with junaio to see what you are getting.

  • Creating and using LLA Markers

Download

IMG: LLA Marker Example
IMG: Support LLA Markers
  1. So what are those LLA Markers. LLA simply stands for latitude, longitude, altitude, so there is a geo position encoded in the marker. Once the user of your channel holds the phone over one of those markers, the positioning from the device's GPS sensor is disabled and the encoded position in the marker is used. It is NOT used for tracking (see Glue Tutorials). So this avoids issues with inaccurate GPS sensors indoors. A LLA Marker looks like this (this is the marker created further down, so feel free to test the channel with this marker)
  2. Firstly, you will have to create a new Channel. This time, you want to make sure to check the "Support LLA Markers" - Checkbox (see screenshot).
  3. Let's get started with the code part. Actually you could use the code of the "Hello World POI" - Tutorial, because there are no changes to be done in the code. However, in this case we make it a little more specific. If the user has not scanned a LLA Marker, we return a relativeToScreen POI asking him to do so. Only when the marker is scanned, we will return Indoor POIs.

    Firstly adjust your index.php with this define right at the beginning to make referencing the resources more easy and it's easy to move your channel to some other server or some other folders if necessary.

//WWW_ROOT will hold the path to the html folder -> makes resource referencing easier later on
define('WWW_ROOT', "http://".$_SERVER['HTTP_HOST'].dirname($_SERVER['SCRIPT_NAME'])); 
  1. The search.php needs to be adjusted the following way. The position we want to use for our marker is: in the entrance area of the Moscone Center in San Francisco (37.783174,-122.403141). So as long as the user is not close to this position, the channel will prompt to scan a marker.

    So first check, whether the user is at the position of the marker and the output is started:

//this should/could be added to the config or with multiple markers probably to a database 
$markerLatitude = 37.783174;
$markerLongitude = -122.403141;
$checkBoundries = 0.00001;

$markerScanned = true;

//check if the user has channed the marker
if(abs($position[0] - $markerLatitude) > $checkBoundries || abs($position[1] - $markerLongitude) > $checkBoundries)
	$markerScanned = false;
$jPoiBuilder = new JunaioBuilder($position, MAX_DISTANCE);

//start the output and output buffering
$jPoiBuilder->start();
  1. Based on the $markerScanned Variable, either the GUI Overlay will be returned or two arrows and the final mark.
    First, the overlay is added to prompt for scanning the marker.

    Note: For getting accurate Indoor Locations, you can either calculate them based on bearing and distance or use a Map Tool, such as Google Maps that allows overlay to add indoor maps for accurately positioning POIs and markers.

if(!$markerScanned)
{		
//create the GUI information to scan a LLA Marker to get the current position
	$poi = $jPoiBuilder->createGUIPOI(
		"infoScreen", 
		"0.5,0.15", 
		WWW_ROOT."/resources/LLA_prompt.md2_enc", 
		WWW_ROOT."/resources/lla_prompt.png", 
		.17, 
		"", 
		"", 
		"startNow", 
		"0,1.57,1.57", 
		array(), 
		"click"
	);
	
	$jPoiBuilder->outputPOI($poi);
	
}
  1. Otherwise, the two arrows are being returned plus the "Conference Room 1"

else
{
	$poi = new SinglePOI();

	$poi = $jPoiBuilder->create3DLocationBasedPOI(
		"Arrow",	//name
		"37.783248,-122.403244,0", //position
		WWW_ROOT."/resources/arrow.md2_enc",
		WWW_ROOT."/resources/arrow.png",
		600, //scale
		"", //description
		"", //thumbnail
		"arrow1", //id
		"1.57,0,2.37", //orientation
		"click"
	);	
	
	$poi->setTranslation("0,0,-1500");				
	$jPoiBuilder->outputPOI($poi);

	$poi = $jPoiBuilder->create3DLocationBasedPOI(
		"Arrow",	//name
		"37.783212,-122.403192,0", //position
		WWW_ROOT."/resources/arrow.md2_enc",
		WWW_ROOT."/resources/arrow.png",
		600, //scale
		"", //description
		"", //thumbnail
		"arrow2", //id
		"1.57,0,2.37", //orientation
		"click"
		);	
	
	$poi->setTranslation("0,0,-1500");
	$jPoiBuilder->outputPOI($poi);
	
	$poi = $jPoiBuilder->createBasicLocationBasedPOI(
		"Conference Room 1",	//name
		"37.783294,-122.403299,0", //position
"This is Conference Room 1 with many interesting sessions going on today.",
		WWW_ROOT."/resources/1.png",
		WWW_ROOT."/resources/1.png",
		"conf1" //id							
	);	
	
	$jPoiBuilder->outputPOI($poi);	
	
};
  1. And, of course, the returned will be ended with:

//end xml and output buffering 
$jPoiBuilder->end();
IMG: LLA Marker Creator
LLA Marker
  1. Last step is to create the LLA Marker. Go to http://dev.junaio.com/tools/llamarker and either click on the map or type in a location to create your LLA Markers. In this case, I have typed in the location (see screenshot).
    For this Tutorial I used the coordinates 37.7831740 (latitude), -122.4031410 (longitude) and 0 (altitude).