Ionic - Open Navigation Directions in Apple Maps App

Lowe B picture Lowe B · Mar 24, 2015 · Viewed 9.8k times · Source

I have a variable, the destination, and I need to open the native Apple Maps with the pin to reach the destination. I've tried the solutions answered here: Phonegap - Open Navigation Directions in Apple Maps App but that didn't work. If I reach "maps://xx.xxxx,yy.yyyy" through a browser while testing, it opens a "unsafe:/maps://xx.xxxx,yy.yyyy". It doesn't pin the map, it never point me to the destination i choose. How can i fix that?

Answer

Houghtelin picture Houghtelin · Aug 12, 2015

I use the LaunchNavigator cordova plugin to easily achieve this desired result. This works best on iOS and Windows Phones when paired with the Geo-Location cordova plugin.

To add the LaunchNavigator and Geo-Location Cordova Plugins: open a terminal window, navigate to the root of the project directory and run the following two commands.

cordova plugin add cordova-plugin-geolocation
cordova plugin add uk.co.workingedge.phonegap.plugin.launchnavigator 

after which I implement the functionality of mapping to a given latitude/longitude by adding the following code to my project.

var latitude = 39.7392, longitude = -104.9903;
launchnavigator.navigate([latitude, longitude]);

or I implement the functionality of mapping to an address string by adding the following code to my project.

var destination = "Denver, Colorado";
launchnavigator.navigate(destination);

I have found this to be the simplest means by which to provide "click for directions" functionality to the end users of the mobile app. This works well for me (with no change in code) for iOS, Android and Windows Phone apps.