角4とGoogleマップで複数のマーカーを設定する

Question

こんにちは誰もヘルプGoogleマップコンポーネントに複数の角度を設定するように設定する必要があります。このコードを表示するには、単一のマーカーを得ることができます。

ngOnInit() { 
    const myLatlng = new google.maps.LatLng(40.748817, -73.985428); 
    const mapOptions = { 
     zoom: 13, 
     center: myLatlng, 
     scrollwheel: false 

    }; 
    const map = new google.maps.Map(document.getElementById('map'), mapOptions); 
    const Marker = new google.maps.Marker({ 
     position: myLatlng, 
     title: 'Hello World!' 
    }); 
    // To add the marker to the map, call setMap(); 
    Marker.setMap(map); 


} 

複数の場所を表示するにはどうすればよいですか。 JSONの場所は以下のようになっています。

{ 
     "locations": [ 
      { 
       "_id": "59eb784fa8e0be0004fb466e", 
       "updatedAt": "2017-10-21T16:39:43.338Z", 
       "createdAt": "2017-10-21T16:39:43.338Z", 
       "latitude": "0.2346285", 
       "longitude": "32.4352628", 
       "locationName": "Prime warehouse A", 
       "locationInfo": "Kampala Warehouse #001", 
       "__v": 0 
      }, 
      { 
       "_id": "1568eb54560be000456466e", 
       "updatedAt": "2018-10-21T16:39:43.448Z", 
       "createdAt": "2016-09-11T16:39:43.338Z", 
       "latitude": "4.3346285", 
       "longitude": "32.4352628", 
       "locationName": "Prime warehouse A", 
       "locationInfo": "Kampala Warehouse #001", 
       "__v": 0 
      } 
     ] 
    } 

Answer 1

は、限り、あなたはあなたのlocationsアレイにアクセスすることができますように、そしてあなたはそれを通って、そこからのループは、マーカーごとに作成することができます。あなたはngOnInit機能にすべてをかける場合はここで

はサンプルです：

ngOnInit() { 
    let map; 
    const locations; // if you have your locations hard-coded, else just make sure it's accessible 

    const myLatlng = new google.maps.LatLng(40.748817, -73.985428); 
    const mapOptions = { 
    zoom: 13, 
    center: myLatlng, 
    scrollwheel: false 

}; 

    map = new google.maps.Map(document.getElementById('map'), mapOptions); 


    // loop through each object of your locations array 
    for (let location in locations) { 

    // The marker's position property needs an object like { lat: 0, lng: 0 }; 
    // Number(location.latitude) is there to convert the string to a number, but if it's a number already, there's no need to cast it further. 
    let latLng = {lat: Number(location.latitude), lng: Number(location.longitude)}; 

    // Set the position and title 
    let marker = new google.maps.Marker({ 
     position: latLng, 
     title: location.locationName 
    }) 

    // place marker in map 
    marker.setMap(map) 
    } 
} 

あなたが助けGoogle's official documentation

希望に地図へのデータのインポートについての詳細を学ぶことができます！