2017-09-03 8 views
1

私はいくつかのことを処理するためにKnockoutJSをミックスに導入するまで、私が取り組んでいる小さな地図プロジェクトを得て、素晴らしい仕事をしてきました。私は、フロントエンドでの表示を容易にするために、観測可能な配列を介してマーカーを定義しました。しかし、マップにマーカーを置くように呼び出そうとすると、マーカーが表示されません。私は以下のコードで緯度/経度オブジェクトリテラルを削除する(ただし、アレイの一部として数字を維持)、ちょうどそれぞれノックアウトオブジェクトリテラルはGoogleマップでは使用できませんか?

markers()[i][1] 

markers()[i][2] 

を経由して、それらを呼び出すと、私はマーカーを取得します。ハーフ!私はノックアウトのドキュメントを注いだし、これに関する情報が見つかりませんでした。コンソールエラーを投げてはいけません。地図上にはマーカーがありません。どんな助けにも大変感謝しています!

var markers = ko.observableArray([ 
    [{ Name: 'Eye On Entrepreneurs' }, { lat: 45.913750 }, { lng: -89.257755 }], 
    [{ Name: 'Trigs of Eagle River' }, { lat: 45.915717 }, { lng: -89.240019 }], 
    [{ Name: 'Eagle River Airport' }, { lat: 45.934099 }, { lng: -89.261834 }] 
]); 

function initMap() { 
    map = new google.maps.Map(document.getElementById('map'), { 
    center: {lat: 45.917034, lng: -89.248168}, 
    zoom: 15, 
    disableDefaultUI: true 
    }); 

    for (i = 0; i < markers().length; i++){ 
    var position = new google.maps.LatLng(markers()[i].lat, markers()[i].lng); 
    marker = new google.maps.Marker({ 
     position: position, 
     map: map, 
     title: markers()[i].name 
    }); 
    } 
} 

答えて

2

私は現在、オフィスでKnockoutJSとOracleJETを使用しています。

間違っているわけではありませんが、observableArrayの内部にはさらに多くの配列がありますが、これまでユースケースは見ていませんでした。親observableArray内にオブジェクトを置くだけです。私はあなたのコードを次のように修正しました:

this.markers = ko.observableArray([ 
       {Name: 'Eye On Entrepreneurs', lat: 45.913750, lng: -89.257755}, 
       {Name: 'Trigs of Eagle River', lat: 45.915717, lng: -89.240019}, 
       {Name: 'Eagle River Airport', lat: 45.934099, lng: -89.261834} 
      ]); 

これは問題なく動作します。

あなたはタイプミスがあります:名前の「n」を大文字にします。 title: self.markers()[i].Name

+0

これをビューモデルに追加すると、そのトリックはうまくいきました。助けてくれてありがとう! – IkeDoud

関連する問題