htmlmobile

How to open a mobile device's map app when a user clicks on a link?


I have a web app where if a user clicks on a link it should open up a map. The best solution that I can think of is to open up a new tab/window to google maps using the target="_blank" attribute.

But I think that it would be best to open up the device's map app instead of google map.

I know that you can have the user's phone app to pop when the user clicks on a phone number with the href attribute pointing to tel:<the phone number>. I am wondering if this is also possible with the map app.

Is there a way to allow an anchor tag to open the mobile device's map app when the user clicks it?


Solution

  • You can use the GEO URI Scheme "geo:latitude,longitude" specified by RFC 5870 in a link such as

    <a href="geo:124.028582,-29.201930" target="_blank">Click here for map</a>
    

    There's also the comgooglemaps:, which launches the Google Maps app for iOS, for example:

    comgooglemaps://?center=40.765819,-73.975866&zoom=14&views=traffic
    

    Where

    And as techtheatre said, you can use a regular Apple Maps link to trigger Apple Maps:

    //maps.apple.com/?q=Raleigh,NC
    

    Leaving off the protocol will automatically select the correct one to use, so if you wanted to have a dynamic link you could just create some conditional code that changes the link between google.com and apple.com depending on which system you're on.