maps://?q=LAT,LNG
geo:LAT,LNG
geo:0,0?q=LAT,LNG
geo:0,0?q=LAT,LNG(LABEL)
Last active
January 20, 2024 16:09
-
-
Save danharper/844382901f7a7b73b90a to your computer and use it in GitHub Desktop.
Open native Maps apps on iOS and Android in Cordova
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var geocoords = lat + ',' + lng; | |
| if (iOS) { | |
| window.open('maps://?q=' + geocoords, '_system'); | |
| } | |
| else { | |
| var label = encodeURI('7 East Street'); // encode the label! | |
| window.open('geo:0,0?q=' + geocoords + '(' + label + ')', '_system'); | |
| } |
For those who faild to open map, try add this line in your config.xml
<allow-intent href="maps:*" />
It works for me ,,, Thanks
Hey, im doing something like this:
<a href="maps:*" onclick="window.open('maps://?q=' + detail.location?.latlng, '_system', 'location=yes'); return false;">
however the maps app opens but is not redirected to the location. ive even tried manually entering the lat and long but with no luck. all it does is open maps. I also added
<allow-intent href="maps:*" />
to the config.xml file. Can someone please comment in on what might be going wrong?
If you just want to open the native Maps App, here is a simple solution:
function openNativeMapsApp(address) {
var maps_schema = encodeURI('maps://?q=' + address);
window.open(maps_schema, "_system"); // Use this for Android
window.location.href = maps_schema; // Use this for iOS
}
Make sure you have this in your config.xml file:
<allow-intent href="maps:*" />
Hi i tried above mentioned solution.
step1. window.open("comgooglemaps://?q=" + location + "(" + address + ")", "_system");
step2: window.open("maps://?daddr=" + location, "_self");
step3: window.open("maps://?qaddr=" + location, "_self"); // tried earlier did not work
step4: window.location.href = "maps://?q="+lat+","+lng;
added but still no luck, its not opening any map in emulator. iphone 8 plus 13.3
already set block-popups in safari settings --- NO
Hi,
I was also struggling with this approach and finally found that you need to have InAppBrowser installed:
https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-inappbrowser/
if (window.device.platform === "iOS") {
cordova.InAppBrowser.open(`maps://?q=${w.lat},${w.lng}`, "_system");
} else {
cordova.InAppBrowser.open(`geo:0,0?q=${w.lat},${w.lng}(${w.name})`, "_system");
}
Note to whoever in iOS getting unsupported url error after using maps:// and added allow-intent href="maps:*", please remove allow-navigation href="*" setting in config.xml
can ios map be show without the pin?
I you want it to work both on waze and maps, use:
const lng = 42.00000;
const lat = -0.001;
const geocoords = lat + ',' + lng;
const label = encodeURI('7 East Street'); // encode the label!
window.open('geo:' + geocoords + '?q=' + geocoords + '(' + label + ')', '_system');
Note to whoever in iOS getting unsupported url error after using maps:// and added allow-intent href="maps:", please remove allow-navigation href="" setting in config.xml
Thanks for this.
For the Android part to work, make sure to add <allow-intent href="geo:*" /> to the Android section of config.xml. I didn't need to do this with "maps:*" for iOS but I added it anyway just in case.
@rafal-r At least with the latest Cordova it's not necessary to have inappbrowser installed (confirmed working without it):
"cordova-android": "^9.1.0",
"cordova-ios": "^6.2.0",
"cordova": "^10.0.0",
Here's what works for me:
const query = "53.723337, -69.995790";
if (ios) {
window.location.href = encodeURI(`maps://?q=${query}`);
} else if (android) {
window.open(encodeURI(`geo:0,0?q=${query}`), "_system");
}
working solution form @ fortinmike
but for me works only if I added <allow-intent href="maps:*" />
works! but how to select a location and bring the coordinates back to Cordova app?
For the Android part to work, make sure to add
<allow-intent href="geo:*" />to the Android section of config.xml. I didn't need to do this with "maps:*" for iOS but I added it anyway just in case.@rafal-r At least with the latest Cordova it's not necessary to have inappbrowser installed (confirmed working without it):
"cordova-android": "^9.1.0", "cordova-ios": "^6.2.0", "cordova": "^10.0.0",Here's what works for me:
const query = "53.723337, -69.995790"; if (ios) { window.location.href = encodeURI(`maps://?q=${query}`); } else if (android) { window.open(encodeURI(`geo:0,0?q=${query}`), "_system"); }
This worked for me!! 2024 Cordova android
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
@guillermo-medina, I succeded with
maps://?ll=${latitude},${ongitude}&address=${addressString}&dirflg=d