Google Maps APIがポリライン配列のプロットを拒否しているのはなぜですか？

Question

私は、ポリラインのパス配列をどのように構築するのかと問題があると思いますが、このようにする方法が必要です。目標は、 "address []"という名前の配列入力フィールドからジオコード位置の配列を作成することです。

// ARRAY 
var linePath = [ 
new google.maps.LatLng(37.772323, -122.214897), 
new google.maps.LatLng(21.291982, -157.821856), 
new google.maps.LatLng(-18.142599, 178.431), 
new google.maps.LatLng(-27.46758, 153.027892) 
]; 

// console.log(linePath); 
[P { Ia=37.772323, Ja=-122.21489700000001}, P { Ia=21.291982, Ja=-157.82185600000003}, P { Ia=-18.142599, Ja=178.43100000000004}, P { Ia=-27.46758, Ja=153.02789200000007}] 

しかし、私は、$ .each声明から配列を作成しようとすると、配列が異なって出てくると動作しません：私はこれを行うことによって動作するようにポリラインを得ています。ここに私が書いたコードがあります：

// ARRAY 
$("input[name='submit']").click(function() { 
    var geocoder = new google.maps.Geocoder(); 
    locations = new Array(); 
    $("input[name='address[]']").each(function() { 
     geocoder.geocode({"address" : this.value }, function(results) { 
      var addrLl = results[0].geometry.location; 
      locations.push(addrLl); 
      var marker = new google.maps.Marker({ 
       map: map, 
       position: addrLl 
      }); 
     }); 
    }); 

    var connect = new google.maps.Polyline({ 
     path: locations, 
     strokeColor: "#FF0000", 
     strokeOpacity: 1. 
    }); 
    connect.setMap(map); 
    return false; 
}); 

// console.log(locations); 
[] 
    [+] 0 P { Ia=41.8843266, Ja=-78.79295300000001} 
    [+] 1 P { Ia=35.9614504, Ja=-79.04755590000002} 

私は何をすべきですか？

Answer 1

ジオコーディングは非同期です。ポリラインを構築するまでに結果が返ってこなかったので、ポリラインには含まれません。ジオコーダが戻ってくると（おそらく最大2秒後に）ポイントが場所に追加されるので、コンソールにログを記録したときにそのポイントが表示されますが、ポリラインはそれを認識しません。

幸いなことに、Maps APIには、MVCArrayを使用するためのすっきりしたソリューションがあります。置き換え：

今

locations = new MVCArray(); 

と

locations = new Array(); 

、あなたはそれはあなたがすでに多角形を作成した後、ポリゴンが通知されますされ、更新される場合でも、配列に新しいポイントを追加するたびにポイントを含める。