*
iOS (and hopefully Android) Application
iOS & Android / latest SDKs
Tested on iOS simulator and iphone 4s device
Host Operating System: OSX
Titanium Studio, build: 3.2.1.201402041146
*
Greetings,
I am trying to build an app which uses geolocation to construct a route and show it in mapview using an array of lat/long points.
The idea is to use this to map out hiking trails in the woods so there is no Geocoding required only lat/long position.
However, it seems I am having trouble passing the coord outside of the Geolocation.getCurrentPosition function. When I run the app I get this:
undefined' is not an object (evaluating 'e.coords.longitude')
I can't help but think I have a syntax problem somewhere.
Apologies for my lack of Javascript Proficiency.
Thanks in advance!
//WELCOME TO TrailDOTS!
//The purpose of this App is to create a trail (route) on the device
//native mapping program by tracking the users position.
//METHODOLOGY:
//Device Geolocation Services will begin to plot Lat/Long position every 10s when
//user presses the "Start" Button.
//These positions will be stored in an array called "points".
//A "route" will be shown on the map showing where the user's current trail
//Post Final Project Scope:
//The routes can be saved locally on the device and even exported to be drawn in other
//programs.
//Add a compass to use when walking in the woods
/////////////THIS IS THE MAPPING MODULE 'CREATE.JS'\\\\\\\\\\\\\\\\\\\\\\\\\\\
////////////LETS GET STARTED BUILDING TrailDOTS!\\\\\\\\\\\\\\\\\\\\\\\\\\\
function create(){
var self = Ti.UI.createWindow({
backgroundcolor:'green',
backgroundImage: '/images/trail.png',
title: 'TrailDOTS....Create Trail',
barColor: '#495E49'
});
var Map = require('ti.map');
//This timer will help us determine when to take a lat/long reading latter on.
var timerStarted = false;
var intTimer;
//create array will to hold all the latitude and longitude points in our route
var points = [];
//create route object
var route =
//Map.createRoute({
{
name : 'My Trail',
points : points,
color : "red",
width : 4
};
//});
//may need to add this below later
// mapview.addRoute(route);
///////////////////////////////////////\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
//////////////////////////START NAVBAR\\\\\\\\\\\\\\\\\\\\\\\\\\\
//Create Control Buttons at Top of Page
var navbar = Titanium.UI.createView({
top: 0,
left: 0,
width: 320,
height: 40,
backgroundColor: '#000'
//backgroundImage: 'images/navbox.png'
});
var button_start = Titanium.UI.createButton({
top: 5,
left: 0,
width: 80,
height: 30,
backgroundImage: 'images/button_start.png',
borderRadius: 3
});
var button_stop = Titanium.UI.createButton({
top: 5,
left: 80,
width: 80,
height: 30,
backgroundImage: 'images/button_stop.png',
borderRadius: 3
});
var button_save = Titanium.UI.createButton({
top: 5,
left: 160,
width: 80,
height: 30,
backgroundImage: 'images/button_save.png',
borderRadius: 3
});
var button_compass = Titanium.UI.createButton({
top: 5,
left: 240,
width: 80,
height: 30,
backgroundImage: 'images/button_compass.png',
borderRadius: 3
});
navbar.add(button_start);
navbar.add(button_stop);
//funtionality for these buttons will come later
navbar.add(button_save);
navbar.add(button_compass);
//////////////////////////END NAVBAR\\\\\\\\\\\\\\\\\\\\\\\\\\\
//////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
////////////////////CORE MAP CREATION START\\\\\\\\\\\\\\\\\\\\\\\
//---------------------CREATE THE MAPVIEW-------------------------
var mapview = Map.createView({
//create some space at top for control buttons
top: 40,
height: 460,
mapType: Map.HYBRID_TYPE,
//initiate with bogus coordinates as placeholders
region:{latitude: 50, longitude:-70, latitudeDelta:0.001, longitudeDelta:0.001},
animate: true,
regionFit: true,
//!!THIS IS IMPORTANT!!
userLocation: true
});
//---------------------END CREATE THE MAPVIEW------------------------
//-----------------ENABLE THE START BUTTON TO BEGIN TRACKING POSITION-----
button_start.addEventListener('click', function(e){
Ti.API.info('Start Button Hath Been Clicked');
if(timerStarted == false)
{
Ti.API.info('Timer will start...');
points = [];
//set our first point
Titanium.Geolocation.getCurrentPosition(function(e) {
var currLongitude = e.coords.longitude;
var currLatitude = e.coords.latitude;
points.push({latitude: e.currLatitude, longitude: e.currLongitude});
//add new point to route
route.points = points;
//add route to our mapview object
mapview.createRoute(route);
timerStarted = true;
//start timer and refresh it every 10 seconds
//10 seconds = 10,000 milliseconds
intTimer = setInterval(recordCurrentLocation, 10000);
});
}
else
{
//stop the running timer
if(timerStarted == true /* && (e.clicksource == 'button_stop')*/)
{
clearInterval(intTimer);
timerStarted = false;
alert('Click Save Trail to Keep this Trail');
}
}
});
//----------END ENABLE THE START BUTTON TO BEGIN TRACKING POSITION-----
//-----------------RECORD CURRENT LOCATION----------------------------------------------
//this function records the current location
function recordCurrentLocation()
{
Ti.API.info('getting next position...');
//bogus points to initialize
points.push({latitude:50,longitude:-70});
route.points = points;
//get the current position
Titanium.Geolocation.getCurrentPosition(function(e) {
var currLongitude = e.coords.longitude;
var currLatitude = e.coords.latitude;
points.push({latitude: e.currLatitude, longitude: e.currLongitude});
//add new point to route
route.points = points;
//remove the old route and add this new one
mapview.removeRoute(route);
mapview.createRoute(route);
});
}
//------------------END RECORD CURRENT LOCATION----------------------------
//-----------------GET CURRENT POSITION----------------------------
//set the distance filter
Titanium.Geolocation.distanceFilter = 10;
//This is required.
Ti.Geolocation.purpose = "To Map a Trail with a Geolocation Enabled Device";
Titanium.Geolocation.getCurrentPosition(function(e)
{
if (e.error)
{
//if mapping non-functional return an alert
alert('GeoLocation May Not be Available or Enabled on Your Device');
return;
}
//get the properties from Titanium.GeoLocation
//most of these will not be used in this app.
var longitude = e.coords.longitude;
var latitude = e.coords.latitude;
var altitude = e.coords.altitude;
var heading = e.coords.heading;
var accuracy = e.coords.accuracy;
var speed = e.coords.speed;
var timestamp = e.coords.timestamp;
var altitudeAccuracy = e.coords.altitudeAccuracy;
//apply the lat and lon properties to our mapview
//!!!USE THIS METHOD TO PASS the above properties
mapview.region = {latitude: latitude, longitude: longitude, latitudeDelta:0.5, longitudeDelta:0.5};
});
//----------------------END GET CURRENT POSITION----------------------------
////////////////////CORE MAP CREATION END\\\\\\\\\\\\\\\\\\\\\\\
//add all window components here
self.add(mapview);
self.add(navbar);
return self;
}
module.exports = create;