代码之家 › 专栏 › 技术社区 › Onyx

如何使用谷歌地图API获取城市名称

google-maps-api-3 google-maps

-2

Onyx · 技术社区 · 6 年前

在伦敦,城市名称位于类型为的对象中 postal_town locality 在东京,它位于类型为的对象中 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)}

1 回复 | 直到 6 年前

Professor Abronsius 6 年前

面对试图在地理编码器响应中轻松找到特定项目的问题,我倾向于使用以下函数——它对我来说相当有效,但我可以想象,在某些情况下,它可能会产生不正确的结果。

/*
    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 )