I am using google maps to provide directions to multiple locations within a website. Users are in Japan, but are non-Japanese, so results should be in English.
In certain examples, even when the name is in the query parameter, a link like this location, returns an alternate Japanese place name (主教座聖堂牧師館), instead of "St. Andrew's Tokyo."
This link is dynamically generated, so I can change the parameters if need be, but I can't figure out how to force results that look more like this, without hardcoding the entire link. Here is what builds the URL:
//handle directions links; send to Apple Maps (iOS), or Google Maps (everything else)
var iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);
$body.on('click', 'a.tsml-directions', function(e){
e.preventDefault();
var directions = (iOS ? 'maps://?' : 'https://maps.google.com/?') + $.param({
daddr: $(this).attr('data-latitude') + ',' + $(this).attr('data-longitude'),
saddr: 'Current Location',
q: $(this).attr('data-location')
});
window.open(directions);
});
I've had a look at your sample URL https://www.google.com/maps?daddr=35.6603676,139.7444553&saddr=Yotsuya,%20Shinjuku,%20Tokyo%20160-0004&q=St.%20Andrew%27s%20Tokyo
.
I understand that your intention is getting a directions on Google Maps. In the aforementioned URL you specify parameters for origin saddr
and destination daddr
, the q
parameter shouldn't affect directions in this case. So, the destination address is just coordinate 35.6603676,139.7444553
. When I reverse geocode this coordinate I get the 'Japan, 〒105-0011 Tōkyō-to, Minato-ku, Shibakōen, 3 Chome−6−18 主教座聖堂牧師館' address as shown in Geocoder tool:
The 主教座聖堂牧師館
corresponds to premise address component and I suspect it is not translated to English in Google database, because web service call with language set to English returns this component in original language as well
https://maps.googleapis.com/maps/api/geocode/json?latlng=35.6603676%2C139.7444553&language=en&key=YOUR_API_KEY
If your destination should be St. Andrew's, use it as a destination parameter.
And the most important part: Google has Google Maps URLs as an official, recommended and documented method to construct URLs. I would suggest using this API in order to create your directions URLs. These URLs are cross-platform, so there is no need to create different URLs for iOS, Android or web browser.
Your example will convert into
https://www.google.com/maps/dir/?api=1&origin=Yotsuya,%20Shinjuku,%20Tokyo%20160-0004&destination=St.%20Andrew%27s%20Tokyo&travelmode=driving
The result is shown in the screenshot
Your code might be something like
$body.on('click', 'a.tsml-directions', function(e){
e.preventDefault();
var directions = 'https://www.google.com/maps/dir/?' + $.param({
api: "1",
destination: $(this).attr('data-location'),
travelmode: "driving"
});
window.open(directions);
});
Note I don't specify origin parameter as it is optional and in this case it should be interpreted as my current location.
I hope this helps!