一起使用 google places api 和 google geocode api答案

【问题标题】：Using google places api with google geocode api together一起使用 google places api 和 google geocode api
【发布时间】：2014-08-02 05:31:38
【问题描述】：

我正在使用 google places 自动完成 api，现在我想获取该地址的地理编码并在地图上显示该区域。这是我的代码...

<head>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script>

<script>
// This example adds a search box to a map, using the Google Place Autocomplete
// feature. People can enter geographical searches. The search box will return a
// pick list containing a mix of places and predicted search terms.

function initialize() {

var input = document.getElementById('searchTextField');
var autocomplete = new google.maps.places.Autocomplete(input);
}

google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<input id="searchTextField" type="text" size="50">
</body>

我知道有 google geocde api，但我真的不知道该怎么做。我在wordpress中做这一切。有人知道这个吗？？？

【问题讨论】：

标签： wordpress google-places-api

【解决方案1】：

看起来这就是你需要的：

<style>
#map-canvas {
    width: 500px;
    height: 500px;
}
</style>

那么，JS

function initialize() {
    // initial zoom and position
    var myOptions = {
        zoom: 14,
        center: new google.maps.LatLng(-25.3, 133.8)
    };

    // create Map instance
    var map = new google.maps.Map(document.getElementById('map-canvas'), myOptions);

    // get input reference
    var input = document.getElementById('searchTextField');

    // create instance of autocomplete
    var autocomplete = new google.maps.places.Autocomplete(input);

    // listen for changes
    google.maps.event.addListener(autocomplete, 'place_changed', function() {

        // get the selected place
        var place = this.getPlace();

        // if there's a geometry available
        if (place.geometry) {

            // move the map to the position
            map.panTo(place.geometry.location);

            // update the zoom
            map.setZoom(15);

            // log the position
            console.log(place.geometry.location.lat(),place.geometry.location.lng() )
        }


    })
}

【讨论】：