google-mapsgoogle-maps-urls

Google Maps API results vs place results return different names


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);
});

Solution

  • 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:

    https://google-developers.appspot.com/maps/documentation/utils/geocoder/#q%3D35.660368%252C139.744455

    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

    enter image description here

    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!