How to open native map app from the mobile browser

Friday, March 7, 2014
If we need in our mobile web application a link to open google map app of mobile phone to view an address, then, we can make use of html hyperlink tag for it. But,the method of opening google mag app in different devices are different. For iphone/iOS, android phones,windows phones,blackberry, all have different code to call map app from mobile browser.
For example we want to find location "New Delhi",
For Desktop:
<a href="http://maps.google.com?q=New%20Delhi">Find Us</a>

For iPhone:
An iPhone would actually hijack this URL and open the map app automatically.
But it would not plot the route. To plot the route we'd need to modify the URL to:
<a href="http://maps.google.com/?saddr=Current%20Location&daddr= New%20Delhi">Find Us</a>

Here we are setting the source address to "Current Location" and the destination address to our store. If you'd like more information about constructing query strings for Google Maps take a look at http://querystring.org. In my experience anything you can do with them on Google Maps will work in the iPhone app.
For Android:
Instead of simply hijacking URLs to Google Maps like the iPhone, Android is employing the geo: protocol which relates the specific intent to find a geographic location. For information on the geo: protocol and other 'intents' take a look at the following link.
http://developer.android.com/guide/appendix/g-app-intents.html
Here is how we'll construct our URL for Android.
<a href="geo:New%20Delhi">Find Us</a>
For Windows Phone 7 and the IE Mobile browser use another protocol, the maps: protocol.
<a href="maps:New%20Delhi">Find Us</a>
We can use JavaScript to determine if the user is on one of our targeted platforms by analyzing the user-agent string.On the basis of platform we can change the href of hyperlink as per our requirement.

2 comments:

  1. Unknown said...:

    Thanks for a great information in your blog. I have read all the post of your blog. Great work on Magento http://thecreatingexperts.com/magento-training-in-chennai/

  1. Hey there! I know this is kinda off topic but I was wondering if you knew where I could find a captcha plugin for my comment form? I'm using the same blog platform as yours and I'm having problems finding one? Thanks a lot! criação loja virtual

Post a Comment