javascript - 将字符串转换为谷歌地图地点

Question

我有一个搜索框和一个 map ，因此当用户在搜索框中写入地点时， map 应该移动到用户选择的地点。

我用这段代码来做到这一点:

var input = document.getElementById('addressInput');
var searchBox = new google.maps.places.SearchBox((input));
var places = searchBox.getPlaces();
google.maps.event.addListener(searchBox, 'places_changed', function () {
   places = searchBox.getPlaces();
   if (places[0].geometry.viewport) {
      map.fitBounds(places[0].geometry.viewport);
   } else {
      map.setCenter(places[0].geometry.location);
      map.setZoom(17); // Why 17? Because it looks good.
   }
});

因此，当用户更改我的搜索框中的位置时，一切正常

问题是当我第一次到达包含 map 的页面时，因为我已经有一个像“奥兰多”或“伊利诺伊州芝加哥”这样的字符串(我从另一个页面获取这个字符串)并且我输入了该值进入搜索框

document.getElementById('addressInput').value='Orlando';

但我不知道地点具体信息，因为这不是 place_changed 事件

如何将该字符串转换为一个位置？

Answer 1

它对您不起作用的原因是(可能我们看不到实际的代码)您尝试在谷歌地图的所有部分完成加载之前进行搜索。将代码放入 idle 事件中:

google.maps.event.addListenerOnce(map, 'idle', function(){  
  input.value='Orlando';
  input.focus(); 
});

而且它有效。参见 fiddle -> http://jsfiddle.net/2L5t3/

<小时/>

更新。如果您想要自动搜索并自动选择第一个搜索结果/预测，我建议您在页面加载时使用google.maps.places.PlacesService。将空闲函数更改为:

google.maps.event.addListenerOnce(map, 'idle', function(){  
    var request = {
        query: 'Orlando'
    };

    service = new google.maps.places.PlacesService(map);
    service.textSearch(request, callback);

    function callback(results, status) {
        if (status == google.maps.places.PlacesServiceStatus.OK) {
            //grab the first item, Orlando, Florida, USA
            var place = results[0];
            input.value = place.formatted_address; 
            map.setCenter(place.geometry.location);
        }
    }
});

参见 -> http://jsfiddle.net/j2Kn3/

searchBox/places_changed 之后工作正常。这仅由页面加载调用，并返回相同的纬度/经度，就像您搜索奥兰多并以用户身份获取第一个预测一样。

我尝试了 100 种方法，但如果没有一些用户操作，似乎不可能选择 .pac-container 上的第一个项目，甚至尝试调度事件 - 没有运气。