Skip to content

Instantly share code, notes, and snippets.

@Skoua
Last active July 29, 2016 19:07
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 4 You must be signed in to fork a gist
  • Save Skoua/5927652 to your computer and use it in GitHub Desktop.
Save Skoua/5927652 to your computer and use it in GitHub Desktop.
Add route to an Apple Map using Google Maps Directions API in Titanium (Alloy).
// setup geolocation purpose and accuracy
Ti.Geolocation.accuracy = Ti.Geolocation.ACCURACY_BEST;
Ti.Geolocation.purpose = L('geo-purpose');
// setup map and poi's annotation
var latitude = 48.847684,
longitude = 2.35165;
var annotation = Titanium.Map.createAnnotation({
animate: true,
pincolor: Titanium.Map.ANNOTATION_PURPLE,
title: L('name'),
subtitle: L('address'),
latitude: latitude,
longitude: longitude
});
$.mapView.animate = true;
$.mapView.regionFit = true;
$.mapView.userLocation = true;
$.mapView.region = {
latitude: latitude,
longitude: longitude,
latitudeDelta: 0.01,
longitudeDelta: 0.01
};
$.mapView.addAnnotation(annotation);
$.mapView.selectAnnotation(annotation);
// route
$.btnRoute.addEventListener('click', function(){
Ti.Geolocation.getCurrentPosition(function(e){
// user's pin
var userAnnotation = Titanium.Map.createAnnotation({
animate: true,
pincolor: Ti.Map.ANNOTATION_PURPLE,
title: L('your-position'),
latitude: e.coords.latitude,
longitude: e.coords.longitude
});
$.mapView.addAnnotation(userAnnotation);
// call Google Maps API and parse xml
var data = [];
var url = "http://maps.googleapis.com/maps/api/directions/xml?origin=" + e.coords.latitude + ',' + e.coords.longitude + "&destination=" + latitude + ',' + longitude + "&sensor=false";
var xhr = Titanium.Network.createHTTPClient();
xhr.open('GET', url);
xhr.onload = function(){
var xml = this.responseXML;
var points = [];
var steps = xml.documentElement.getElementsByTagName('step');
var numSteps = steps.length;
for(var i = 0; i< numSteps; i++)
{
var step = steps.item(i);
var endLocation = step.getElementsByTagName('end_location').item(0);
var lat = endLocation.getElementsByTagName('lat').item(0).text;
var lng = endLocation.getElementsByTagName('lng').item(0).text;
points.push({
latitude: lat,
longitude: lng
});
}
// create route
var route = {
name: 'My Route',
points: points,
color: 'purple',
width: 3
};
// add a route
$.mapView.addRoute(route);
};
xhr.send();
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment