Phonegap - Open Navigation Directions In Apple Maps App

I have two variables - Destination and Source - and, using Phonegap, I'm trying to use jQuery to open the external iPhone Apple Maps app with directions. The code I'm using looks l

Solution 1:

Changing http://maps.apple.com/?q= to just maps: did the trick.

---

NB: make sure you write maps: and not map: as, while the latter will run the correct app, it will crash immediately after opening (thanks jprofitt)

Solution 2:

Today I was able to open the native Apple Maps app with marker from a Cordova app using BOTH of the follow URL schemes:

maps://maps.apple.com/?q={latitude},{longitude}

AND

maps://?q={latitude},{longitude}

In a link:

<ahref="maps://maps.apple.com?q={latitude},{longitude}"><!-- OR --><ahref="maps://?q={latitude},{longitude}">

From JavaScript:

window.location.href = "maps://maps.apple.com/?q="+lat+","+lng;
// ORwindow.location.href = "maps://?q="+lat+","+lng;

The app is running on an iOS device, iOS version 8.1.2, and cordova-ios is version 3.7.0.

Solution 3:

In my case, changing from http://maps.apple.com/?q= to only maps:?q= not solving the problem.

The working scheme that open native Apple Maps with marker is as follows:

maps://maps.apple.com/?q={latitude},{longitude}

full working code:

window.location.href = "maps://maps.apple.com/?q="+lat+","+lng;

Tested working with iOS7.1 simulator, might not works in later version. I don't have the opportunity to test. Sorry.

Supported Apple Maps parameters can be found here: https://developer.apple.com/library/ios/featuredarticles/iPhoneURLScheme_Reference/MapLinks/MapLinks.html

Credit goes to this SO link: Here

Solution 4:

The code

I managed to get this working in 2018 on iOS 11.2 using the following format in iOS:

<aonclick="window.open('maps://?q=51.178847,-1.826160', '_system');">Open in Maps</a>

And this format on Android:

<aonclick="window.open('geo:0,0?q=51.178847,-1.826160', '_system');">Open in Maps</a>

Config permissions

Additionally, don't forget to add permissions to your config.xml file like so:

<allow-intenthref="maps:*" />

In my project the geo: intention had existed from the beginning so it took my a while to figure out why this was working on Android and not iOS.