【问题标题】:How to copy automatically the home address in google map?如何在谷歌地图中自动复制家庭地址?
【发布时间】:2014-07-10 15:37:30
【问题描述】:

如何将家庭地址直接自动显示到谷歌地图(maps.google.com)并显示到谷歌地图的搜索栏中?这个家庭地址来自另一个纯 JAVASCRIPT 的网站 (UAT)?请帮我。我是那个PL的新手,所以我不熟悉。谢谢

例子:

在另一个网站有一个家庭地址的文本字段,输入的地址是:

345 Bury Village Oslo St. Bershka City, Switzerland

我想在 Google 地图中复制/显示整个家庭住址并自动搜索该地址

这是我正在使用的代码:

function scanLapVerification() {
try {
    var forAlert = '';
    var el = getElement(document, "class", "workflowActivityDetailPanel", "");
    if (el && el.length > 0) {
        var eltr = getElement(el[0], "tag", "tr", "");
        if (eltr && eltr.length > 0) {
            //Read Contact and Permanent address
            var addresses = {
                CA: { province: null, municipality: null, barangay: null, zip: null, street: null, snumber: null, building: null, floor: null}
               ,PA: { province: null, municipality: null, barangay: null, zip: null, street: null, building: null, bnumber: null, floor: null}
            };
            var address_type = null;
            for (var i = 0; i < eltr.length; i++) {
                tr_text = eltr[i].innerText;
                if (tr_text.substr(0, "Contact address".length) == "Contact address") address_type = "CA";
                if (tr_text.substr(0, "Permanent address".length) == "Permanent address") address_type = "PA";
                if (address_type && tr_text.substr(0, "Province".length) == "Province") {
                    addresses[address_type].province = tr_text.substr("Province".length, tr_text.length - "Province".length);
                    forAlert = forAlert + 'Province: '+ addresses[address_type].province + ',' + address_type + ' > ';
                }
                if (address_type && tr_text.substr(0, "Municipality".length) == "Municipality") {
                    addresses[address_type].municipality = tr_text.substr("Municipality".length, tr_text.length - "Municipality".length);
                    forAlert = forAlert +  'Municipality: '+ addresses[address_type].municipality + ',' + address_type + ' > ';
                }
                if (address_type && tr_text.substr(0, "Barangay".length) == "Barangay") {
                    addresses[address_type].barangay = tr_text.substr("Barangay".length, tr_text.length - "Barangay".length);
                    forAlert = forAlert + 'Barangay: ' + addresses[address_type].barangay + ',' + address_type + ' > ';
                }
                if (address_type && tr_text.substr(0, "ZIP Code".length) == "ZIP Code") {
                    addresses[address_type].zip = tr_text.substr("Zip Code".length, tr_text.length - "ZIP Code".length);
                    forAlert = forAlert + 'ZIP Code: ' + addresses[address_type].zip + ',' + address_type + ' > ';
                }
                if (address_type && tr_text.substr(0, "Street name".length) == "Street") {
                    addresses[address_type].street = tr_text.substr("Street name".length, tr_text.length - "Street".length);
                    forAlert = forAlert + 'Street name: ' + addresses[address_type].street + ',' + address_type + ' > ';
                }
                if (address_type && tr_text.substr(0, "Street number".length) == "Street number") {
                    addresses[address_type].snumber = tr_text.substr("Street number".length, tr_text.length - "Street number".length);
                    forAlert = forAlert + 'Street number: ' + addresses[address_type].snumber + ',' + address_type + ' > ';
                }
                if (address_type && tr_text.substr(0, "Building name".length) == "Building name") {
                    addresses[address_type].building = tr_text.substr("Building".length, tr_text.length - "Building name".length);
                    forAlert = forAlert + 'Building name: ' + addresses[address_type].building + ',' + address_type + ' > ';
                }
                if (address_type && tr_text.substr(0, "Floor number".length) == "Floor number") {
                    addresses[address_type].floor = tr_text.substr("Zip".length, tr_text.length - "Floor number".length);
                    forAlert = forAlert + 'Floor number: ' + addresses[address_type].floor + ',' + address_type + ' > ';
                }
            }

 //Open a new tab for Google Maps
           In this place need to put the code for New tab
//Enter full address into search input
           In this place need to put the code for Displaying the Home Address from another website into Google Maps search bar automatically
        }
    }
    return { status: "KO" };
} catch (e) {
        alert("Exception: scanLapVerification\n" + e.Description);
    return { status: "KO", message: e };
}
};

【问题讨论】:

    标签: javascript google-maps google-search


    【解决方案1】:

    jsfiddle link
    您需要使用geocoding
    像这样:

    HTML

    <input id="address" value="Volgograd, Mamayev Kurgan" /><button type="button" onclick="geocode();">Search</button><button type="button" onclick="searchWithoutGmap();">Search witout GMap</button>  
    <div id="map"></div>  
    <div id="output"></div>  
    

    CSS

    div#map {  
        width: 400px;  
        height: 300px;  
    }  
    

    JS

    var map;
    var marker;
    var geocoder;
    $( function() {
        map = new google.maps.Map( $( "div#map" )[ 0 ], {
            center: new google.maps.LatLng( 48.7, 44.516 ),
            zoom: 8,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        } );
        geocoder = new google.maps.Geocoder();
    } );
    function geocode() {
        var address = $( "input#address" ).val();
        geocoder.geocode( { 'address': address }, function ( results, status ) {
            if ( status == google.maps.GeocoderStatus.OK ) {
                // all founded results
                console.log( results );
                // go to first result
                map.panTo( results[ 0 ].geometry.location );
                // and show or replace marker
                if ( marker ) {
                    marker.setPosition( results[ 0 ].geometry.location );
                } else {
                    marker = new google.maps.Marker( {
                        position: results[ 0 ].geometry.location,
                        map: map
                    } );
                }
                // zoom
                zoomToPan(16);
            } else if ( status == google.maps.GeocoderStatus.ZERO_RESULTS ) {
                alert( "Zero results." );
            }
        } );
    }
    function zoomToPan( level_to ) {
        var zoom = map.getZoom();
        if ( level_to != zoom ) {
            setTimeout( function( current_level_to, current_zoom ){
                return function(){
                    if ( current_level_to < current_zoom ) {
                        map.setZoom( current_zoom - 1 );
                        zoomToPan( current_level_to );
                    } else {
                        map.setZoom( current_zoom + 1 );
                        zoomToPan( current_level_to );
                    }
                }
            }( level_to, zoom ), 80 );
        }
    }
    function searchWithoutGmap() {
        var address = $( "input#address" ).val();
        var format = "json";// xml
        var url = "http://maps.googleapis.com/maps/api/geocode/" + format + "?" + "sensor=false&address=" + address;
        $.ajax( {
            url: url,
            crossDomain: true,
            dataType: "json",
            success: function( data, textStatus, jqXHR ) {
                $( "div#output" ).html( JSON.stringify( data ) );
            }
        } );
    }
    

    【讨论】:

    • 如果我需要显示不同的地址怎么办?
    • 你能把jsfiddle放进去吗?
    • 你的代码不需要google api吗?我的意思是,它指向谷歌地图网站?
    • @user3818821 确实需要。请参阅 jsFiddle 上的 External Resources 部分,其中包含 google maps api js file
    • 好的。但是,当用户输入另一个网站的地址时,是否可以直接访问 maps.google.com 网站而不使用或创建新的谷歌地图?
    猜你喜欢
    • 2013-09-24
    • 2017-08-06
    • 1970-01-01
    • 2013-03-23
    • 2017-09-16
    • 2015-03-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多