首页 > 解决方案 > 如何使用 Google Maps API 获取城市名称

问题描述

在伦敦,城市名称在 type 的对象中postal_town,而在阿姆斯特丹,它在 type 的对象中,locality而在东京,它在 type 的对象中administrative_area_level_1

那么,当城市因城市而异时,我应该如何决定选择哪个对象以提取城市名称?

目前,我有一半有效的东西:

const checkCity = data.address_components.find((component) =>
    component.types.includes('locality')
);
const checkTown = data.address_components.find((component) =>
    component.types.includes('postal_town')
);

if (checkCity) {
    city = checkCity.long_name
} else if (checkTown) {
    city = checkTown.long_name
}

但是,使用这个代码我没有得到正确的东京城市名称,我得到了东京的一个区 Minato-ku 的位置。

东京的结果:

address_components: Array(8)
    0: {long_name: "Sotobori Dori", short_name: "都道405号線", types: Array(1)}
    1: {long_name: "1", short_name: "1", types: Array(3)}
    2: {long_name: "2 Chome", short_name: "2 Chome", types: Array(3)}
    3: {long_name: "Motoakasaka", short_name: "Motoakasaka", types: Array(3)}
    4:
        long_name: "Minato-ku"
        short_name: "Minato-ku"
        types: (2) ["locality", "political"]
        __proto__: Object
    5:
        long_name: "Tōkyō-to"
        short_name: "Tōkyō-to"
        types: (2) ["administrative_area_level_1", "political"]

伦敦的结果:

address_components: Array(7)
    0: {long_name: "27-29", short_name: "27-29", types: Array(1)}
    1: {long_name: "King Street", short_name: "King St", types: Array(1)}
    2:
        long_name: "London"
        short_name: "London"
        types: ["postal_town"]
        __proto__: Object
    3:
        long_name: "Greater London"
        short_name: "Greater London"
        types: (2) ["administrative_area_level_2", "political"]
        __proto__: Object
    4: {long_name: "England", short_name: "England", types: Array(2)}
    5: {long_name: "United Kingdom", short_name: "GB", types: Array(2)}
    6: {long_name: "WC2E 8JB", short_name: "WC2E 8JB", types: Array(1)}

阿姆斯特丹的结果:

address_components: Array(8)
    0: {long_name: "9", short_name: "9", types: Array(1)}
    1: {long_name: "Slijkstraat", short_name: "Slijkstraat", types: Array(1)}
    2: {long_name: "Amsterdam-Centrum", short_name: "Amsterdam-Centrum", types: Array(3)}
    3:
        long_name: "Amsterdam"
        short_name: "Amsterdam"
        types: (2) ["locality", "political"]
        __proto__: Object
    4: {long_name: "Amsterdam", short_name: "Amsterdam", types: Array(2)}
    5: {long_name: "Noord-Holland", short_name: "NH", types: Array(2)}
    6: {long_name: "Netherlands", short_name: "NL", types: Array(2)}
    7: {long_name: "1012 CM", short_name: "1012 CM", types: Array(1)}

标签: google-mapsgoogle-maps-api-3

解决方案


面对试图在 GeoCoder 响应中轻松找到特定项目的问题后,我倾向于使用以下功能 - 它对我来说效果很好,但我可以想象在某些情况下它可能会产生不正确的结果。

/*
    calculate the intersection of two arrays - return result as a `Set` object
    and use the `size` method of the `Set` to determine if we made a match when
    testing the arrays..
*/
const intersect=function(a,b){
    return new Set( a.filter( v => ~b.indexOf( v ) ) );
};

const gettowncity=function( addcomp ){
    if( typeof( addcomp )=='object' && addcomp instanceof Array ){

        let order=[ 'sublocality_level_1', 'neighborhood', 'locality', 'postal_town' ];

        for( let i=0; i < addcomp.length; i++ ){
            let obj=addcomp[ i ];
            let types=obj.types;
            if( intersect( order, types ).size > 0 )return obj;
        }
    }
    return false;
};



In the callback function of the Geocoder request:

if( status == google.maps.GeocoderStatus.OK ){
    let addcomp = results[0].address_components;
    let obj = gettowncity( addcomp );

    if( obj ) console.info( 'Town/City: %o', obj.long_name );

    /* ... other code ... */
}

的变体gettowncity添加了要在响应对象中查找的类型的第二个参数

const findcomponent=function( addcomp, arr ){
    if( typeof( addcomp )=='object' && addcomp instanceof Array ){
        for( let i=0; i < addcomp.length; i++ ){
            let obj=addcomp[ i ];
            let types=obj.types;
            if( intersect( arr, types ).size > 0 )return obj;
        }
    }
    return false;
};

let obj=findcomponent( addcomp, [ 'postal_code' ] );
if( obj ) console.info( 'Postcode: %s', obj.long_name )

查找苏格兰伦齐镇的示例查询


推荐阅读