マップに配置された最後のピンにGoogleマップのオートコンプリートの結果をバイアスする際に問題が発生しました。私はここで、Googleのチュートリアルを次のようだ:次のように https://developers.google.com/maps/documentation/javascript/places-autocomplete#change_search_areaGoogleマップv3のautocomplete.getBounds()は、設定後に未定義を返します
マイCoffeeScriptのコードは次のとおりです。
次のJavaScriptにコンパイルinitSearch = ->
autocomplete = new (google.maps.places.Autocomplete)(document.getElementById('location-query'), types: [ 'geocode' ])
autocomplete.addListener 'place_changed', ->
place = autocomplete.getPlace()
addDestination(place, map, insertIndex) #places pin on map
console.log 'autocomplete bounds (before): ' + autocomplete.getBounds()
#setting bounds around new place
biasCircle = new google.maps.Circle
center: place.geometry.location
radius: 500 #in kilometers
autocomplete.setBounds(biasCircle.getBounds())
console.log 'autocomplete bounds (after): ' + autocomplete.getBounds()
:
initSearch = function() {
var autocomplete;
autocomplete = new google.maps.places.Autocomplete(document.getElementById('location-query'), {
types: ['geocode']
});
return autocomplete.addListener('place_changed', function() {
var biasCircle;
place = autocomplete.getPlace();
addDestination(place, map, insertIndex);
console.log('autocomplete bounds (before): ' + autocomplete.getBounds());
biasCircle = new google.maps.Circle({
center: place.geometry.location,
radius: 500
});
autocomplete.setBounds(biasCircle.getBounds());
return console.log('autocomplete bounds (after): ' + autocomplete.getBounds());
});
};
ピンが正しく上に置かれています私が追加する場所の数にかかわらず、console.logは常に返されます:
autocomplete bounds (before): undefined
autocomplete bounds (after): ((9.923577823579402, -84.09528446042509), (9.932560976420598, -84.08616473957488))
境界は正しく設定されています(第2のconsole.log
で示されています)。実際には結果は偏っておらず、最初の結果は常に未定義になります。
我々は結果が付勢されているかどうかをテストするために使用されているテストケースをされている:オートコンプリートで 1.「サンノゼ」(上位の結果がアメリカであるべき) 2.追加「リモン、コスタリカ」などマップ 3.オートコンプリートの「サンノゼ」に関するマーカー、トップ結果は、サンノゼ、コスタリカ
する必要があります我々は、それはスコープの問題かもしれないと思ったので、私たちはどこでもwindow.autocomplete
を試してみましたが、まだ同じ問題がありました。別の方法(place_changedイベントの代わりに自動補完境界を設定しようとしましたが、これもうまくいきませんでした)。
ありがとうございました!
更新:セドリックのアドバイスでセドリックの回答 をしようと、私は(メソッドがリスナー内から呼び出された)リスナーコールバックの外に境界を設定しようとしているが、私はまだ同じ問題を取得しています。新しいコード:
#Sets autocomplete bias
setAutocompleteBias = (place) ->
console.log 'autocomplete bounds (before): ' + window.autocomplete.getBounds()
#setting bounds around new place
biasCircle = new google.maps.Circle
center: place.geometry.location
radius: 500 #in kilometers
window.autocomplete.setBounds(biasCircle.getBounds())
console.log 'autocomplete bounds (after): ' + window.autocomplete.getBounds()
window.autocomplete = null
#Autocomplete search box initialization
initSearch = ->
window.autocomplete = new (google.maps.places.Autocomplete)(document.getElementById('location-query'), types: [ 'geocode' ])
#autocomplete.bindTo('bounds', map)
window.autocomplete.addListener 'place_changed', ->
place = window.autocomplete.getPlace()
addDestination(place, map, insertIndex)
setAutocompleteBias(place)
素晴らしい!私はあなたの最初の解決策を得ることができました、 'autocomplete.bindTo'は働いています。ただし、マップの現在のビューポートをバインドし、ユーザーがマップに配置したLASTピンにバインドしようとしています。第2の解決策は、常に最初の 'console.log'をdefaultBoundsに設定します。場所が変更されるたびにbiasCircleの範囲をどのように設定できますか? – CHawk
あなたのポイントを得ることは100%ではありません。デフォルトの境界を設定した場合、リスナーコールバックの外側から作成する必要があることに同意します。そうしないと、ユーザー入力が常に上書きされます。 それ以外に、biasCircleから境界を設定すると、間違ったことはありません。 –
自分の現在のコードを含めるように私の質問を編集しました。私はリスナーのコールバックの外に境界を設定しようとしていますが、私は元のエラー(各最初の呼び出しで定義されていません)を取得しています。 – CHawk