지도가없는 Google 장소 검색 창?

-1

사람들이 위치를 변경할 수있는 기능을 구현하고 싶습니다. 그것을 위해 나는 google 장소 api를 사용하고 싶다. 이제 내가 원하는 것은 검색 상자입니다. 누군가가 마을/장소를 입력하면 Google 장소를 검색하고 검색 결과를 표시합니다. 일단 위치가 선택되면 그것은 저에게 lat와 lng의 장소를 줄 것입니다. 맵없이 할 수 있습니까?지도가없는 Google 장소 검색 창?

감사

출처

2017-10-05 Przemyslaw Wojtas

당신은 정확한 주소를 얻기 위해 Google지도 장소 자동 완성을 사용할 수 있습니다, 그리고 당신이 성공적으로 당신이이 위도와 LNG 얻을 수를 지오 코딩 할 수있는 주소를 얻을 후. 이처럼

function codeAddress(address) { 
    geocoder.geocode({ 'address': address}, function(results, status) { 
     if (status == 'OK') { 
     alert(results[0].geometry.location); // This is the lat and lng 
     } else { 
     alert('Geocode was not successful for the following reason: ' + status); 
     } 
    }); 
}

확인이 작업 예 : https://jsbin.com/pejagub/edit?html,js,output

나 또한 여기에 삽입 된 jsbin 넣다 코드 조각이

var placeSearch, autocomplete, geocoder; 
 

 
function initAutocomplete() { 
 
    geocoder = new google.maps.Geocoder(); 
 
    autocomplete = new google.maps.places.Autocomplete(
 
    (document.getElementById('autocomplete')), { 
 
     types: ['geocode'] 
 
    }); 
 

 
    autocomplete.addListener('place_changed', fillInAddress); 
 
} 
 

 
function codeAddress(address) { 
 
    geocoder.geocode({ 
 
    'address': address 
 
    }, function(results, status) { 
 
    if (status == 'OK') { 
 
     // This is the lat and lng results[0].geometry.location 
 
     alert(results[0].geometry.location); 
 
    } else { 
 
     alert('Geocode was not successful for the following reason: ' + status); 
 
    } 
 
    }); 
 
} 
 

 
function fillInAddress() { 
 
    var place = autocomplete.getPlace(); 
 

 
    codeAddress(document.getElementById('autocomplete').value); 
 
}

#autocomplete { 
 
    width: 100%; 
 
}

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 

 
<body> 
 
    <div id="locationField"> 
 
    <input id="autocomplete" placeholder="Enter your address" type="text" /> 
 
    </div> 
 
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCKQX3cyZ7pVKmBwE8wiowivW9qH62AVk8&libraries=places&callback=initAutocomplete" async defer></script> 
 
</body> 
 

 
</html>

작동하지 않습니다

출처

2017-10-05 13:48:15

지도가없는 Google 장소 검색 창?

답변

관련 문제