Display parsed data in info window in Google Maps


I am having trouble trying to display the event name from an array of objects in a parsed JSON file within Google Maps Ionic framework. Right now I have the markers displaying for each event with a simple string called "testing" which displays fine. The problem is I am unsure of how to display each events name within this info window and not the string I made. Any help would be appreciated. I'll post the sample image I have now as well as the info window functionality below. Thanks!

我無法嘗試在Google Maps Ionic框架內的已解析JSON文件中顯示對象數組中的事件名稱。現在我有一個標記顯示每個事件與一個名為“測試”的簡單字符串,顯示正常。問題是我不確定如何在這個信息窗口中顯示每個事件名稱而不是我創建的字符串。任何幫助,將不勝感激。我將發布我現在擁有的示例圖像以及下面的信息窗口功能。謝謝!

what I have displaying now:

我現在展示的內容:

here

這里

marker/info window functionality:

標記/信息窗口功能:

getMarkers(){
//this.http.get('assets/data/markers.json').map((res)=>res.json()).subscribe(data=>{
  this.http.get('http://app.toronto.ca/cc_sr_v1_app/data/edc_eventcal_APR?limit=500').map((res)=>res.json()).subscribe(data=>{
this.addMarkersMap(data);
});
}


addMarkersMap(markers){
for(let marker of markers)
{
 var loc = marker.calEvent.locations[0]['coords'];

  console.log(loc);


  marker = new google.maps.Marker({
   position: loc,
  map: this.map,

  });


  var infoWindow = new google.maps.InfoWindow({
   content: markers.eventName

}); 

google.maps.event.addListener(marker, 'click', function(str)
{ 
   return function() {
           infoWindow.setContent(str);
           infoWindow.open(this.map, marker);
                     }
}(markers.eventName));

}
}

1 个解决方案

#1


0  

I correct myself. You could benefit from a closure here. Use a self-calling function to seal your parameter to the infowindow:

我糾正自己。你可以從這里的封閉中受益。使用自調用函數將參數密封到infowindow:

google.maps.event.addListener(marker, 'click', function(str)
                   { 
                      return function() {
                              infoWindow.setContent(str);
                              infoWindow.open(this.map, marker);
                                        }
                   }(markers.calEvent.eventName));

注意!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系我们删除。



 
粤ICP备14056181号  © 2014-2021 ITdaan.com