Knockout.jsを使用して配列メソッドを使用してGoogleマップにマーカーを追加する

Question

forEach()メソッドとマーカーにアタッチする情報ウィンドウをmap()メソッドを使用してマップマーカーと情報ウィンドウをマップに追加しようとしています。ここで

は、これまでの私のコードです：私は私のブラウザでページをロードすると

//String to display in info window 
var content; 

//Declare Map variable and markers array 
var map; 
var marker; 
var markers = []; 



// cache Info window in a variable 
var window = new google.maps.InfoWindow({}); 

//Create Instance of a map from the Google maps api 
//Grab the reference to the "map" id to display map 
//Set the map options object properties 
function initMap() { 
    map = new google.maps.Map(document.getElementById("map"), { 
     center: {lat: 40.440624, lng: -79.995888}, 
     zoom: 8, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 
}; 

// tells the view model what to do when a change occurs 
function gymLocation(value) { 
    this.name = ko.observable(value.name); 
    this.address = ko.observable(value.address); 
    this.description = ko.observable(value.description); 
    this.lat = ko.observable(value.lat); 
    this.lng = ko.observable(value.lng); 
}; 


//ViewModel 
function ViewModel() { 

    var self = this; 

    //Copies the values of initialLocations and stores them in sortedLocations(); observableArray 
    self.sortedLocations = ko.observableArray(initialLocations.slice()); 

    //Adds new markers at each location in the initialLocations Array 
    self.sortedLocations().forEach(function(location) { 
     marker = new google.map.Marker({ 
      position: location.latlng, 
      map: map, 
      title: location.name 
     }); 

     markers.push(marker); 
    }); 

    //Map info windows to each item in the markers array 
    self.markers.map(function(info) { 
     info.addListener('click', function() { 
      new google.maps.InfoWindow({ 
       position: info.latlng, 
       map: map, 
       title: info.name 
      }); 
     }); 
    }); 
}; 

ko.applyBindings(ViewModel()); 

、私はディスプレイに得ることができる唯一のことは、マップ自体です。コンソールのエラーを確認して受信しました。

app.js:121 Uncaught TypeError: Cannot read property 'Marker' of undefined

私に何か不足していますか？またはこれが機能内のスコープに関する問題である可能性がありますか？

Answer 1

var marker = new google.map.Marker呼び出しでgoogle.mapオブジェクトを参照しているように見えますが、コンパイラが参照されたオブジェクトを見つけることができないという意味は未定義です。あなたが参照しようとしていたものはgoogle.maps（複数）のオブジェクトでした。マップmap = new google.maps.Mapの作成時に正しく参照しました。

修正後のコードイメージについては、添付のリンクを参照してください。 Link to image of your Google Map's App